1
У меня возникла странная проблема с галереей изображений Galleria.js и позвоночника.Galleria.io и backbone.js Использование ЦП 100%
Этот вид иногда скрывается, а затем повторно отображается другой моделью. Что происходит, так это то, что после повторного рендеринга 2 или 3 раза потребление процессора браузером достигает 100%. Я подтвердил, что Galleria вызывает это, потому что я удалил его из представления, а CPU был нормальным.
Я думаю, что мне может понадобиться уничтожить представление, когда он скрывается или что-то еще? Не совсем уверен, как подойти к этому.
App.HouseDetailView = Backbone.View.extend({
el: '.house-details-area',
initialize: function() {
this.template = _.template($('#house-details-template').html());
App.Events.on('show_house', this.render, this);
App.Events.on('show_main_view', this.hide, this);
},
events: {
'click .btn-close': 'hide',
'shown a[data-toggle="tab"][href=".detail-map"]' : 'show_map',
'shown a[data-toggle="tab"][href=".detail-street-view"]' : 'show_street_view',
'change .calculate-price': 'calculate_price',
},
render: function(model) {
this.model = model;
var html = this.template({model:model.toJSON()});
$(this.el).html(html);
Galleria.loadTheme('/static/js/libs/galleria.classic.min.js');
Galleria.run('#galleria', {wait: true});
$(this.el).show();
return this;
},
hide: function() {
$(this.el).hide();
App.detailsRouter.navigate('/', true);
},
show_map: function() {
// check if map already rendered
if (this.$('.detail-map').html() === '') {
var map = new App.DetailMapView({model:this.model});
this.$('.detail-map').html(map.el);
map.refresh();
}
},
show_street_view: function() {
if (this.$('.detail-street-view').html() === '') {
var street_view = new App.DetailStreetView({model:this.model});
this.$('.detail-street-view').append(street_view.el);
street_view.render();
}
},
calculate_price: function (e) {
var price_element = this.$('.price');
var total_price = parseFloat(price_element.attr('data-total-price'));
var people = parseFloat(price_element.attr('data-people'));
// if selected is 1st option: Total price
if (e.srcElement.selectedIndex === 0) {
// show total price
price_element.html('$' + total_price.toFixed(2));
} else {
// show per person price
price_element.html('$' + (total_price/people).toFixed(2));
}
},
});
Вы передаете параметры рендеринга. по внешнему виду этой модели this.model = model; внутри метода рендеринга мне кажется, что вы делаете это 'view.render (model)'. Предпочтительным подходом является 'new View ({model: house});' – Deeptechtons