Backbone: представление визуализации, созданное ранее.

У меня есть представление оболочки, которое содержит панель навигации и карту. В этом виде отображаются другие виды, в которых используется карта, ранее созданная. Когда я перейду к просмотру perfil, карта будет удалена, но панель навигации останется, пока все хорошо. Моя проблема в том, что когда я возвращаюсь домой, карта не отображается, отображается только div, содержащий карту. Ниже показан пример:

Просмотр оболочки и просмотр главной страницы: введите описание изображения здесь

перейдите к просмотру Perfil: введите описание изображения здесь

вернуться домой:

введите описание изображения здесь

вот мой код:

app.js

var ev = new Application();

ev.Router = Backbone.Router.extend({ 
    routes: {
        "": "home",
        "evento/:id" : "evento",
        "criarevento" : "criarevento",
        "perfil" : "perfil"
    }, 

    home: function(){
        setTimeout(function(){
            $('#rightcolumn').html(new ev.views.Home(ev.shell.map).el);
        }, 0);

    },
    ... // other views
    perfil: function(){
        setTimeout(function(){
            $('#home').html(new ev.views.Perfil(ev.shell.template).el);
        }, 0); 
    }
});

$(document).on('ready', function() {
    ev.user = new ev.models.Person(); // Holds the authenticated Facebook user
    // Load HTML templates for the app
    ev.templateLoader.load(['shell', 'home', 'search_keyword', 'evento', 'login', 'quemvai', 'criar_evento', 'home_criar_evento', 'perfil'], function () {
        ev.shell = new ev.views.Shell({el: "#shell", model: ev.user});
        ev.router = new ev.Router();
        Backbone.history.start();
    });
});

perfil.js

ev.views.Perfil = Backbone.View.extend({
    initialize: function(temp, model){
        var that = this;
        that.template = _.template(ev.templateLoader.get('perfil'));
        that.template2 = temp;
        //console.log(this.view);
        ev.router.on("route", function(route, params) {
            that.$el.html(that.template2());
        });
        that.render();  
    },
    render: function(map){
        this.$el.html(this.template()); 
        return this;
    }
});

До сих пор я создал событие, при котором при изменении маршрута вызывается шаблон оболочки, который я перехожу к представлению perfil. Но это не работает. Что я делаю не так?

РЕДАКТИРОВАТЬ: я меняю свой конструктор с учетом perfil, чтобы при изменении маршрута запускался только один раз и вызывалась функция рендеринга ev.shell

 ev.views.Perfil = Backbone.View.extend({
        initialize: function(){
            var that = this;
            that.template = _.template(ev.templateLoader.get('perfil'));
            ev.router.once("route", function(route, params) {
                ev.shell.render();
            });
            that.render();  
        },
        render: function(map){
            this.$el.html(this.template()); 
            return this;
        }
    });

person seal    schedule 29.12.2014    source источник


Ответы (1)


Похоже, у вас есть готовый документ, даже если он загружает оболочку, включая карту. Когда вы переходите на страницу профиля, вы заменяете содержимое элемента #home. Затем, когда вы вернетесь домой, вы замените содержимое элемента #rightcolumn. Вы никогда не перерисовываете карту.

Я думаю, вам нужно также поместить код рендеринга карты в домашнюю функцию маршрутизатора.

В качестве примечания я заметил, что вы используете функцию setTimeout. Если вы используете это, чтобы что-то рендерилось, потому что оно ждет загрузки чего-то другого, вам, вероятно, следует избавиться от этого и прослушать событие.

person Rupert    schedule 29.12.2014
comment
Спасибо за ваше объяснение, мне стало понятнее, что делать, чтобы решить эту проблему. Я изменяю свой конструктор в представлении perfil, так что при изменении маршрута срабатывает только один раз и вызываю render функцию ev.shell - person seal; 29.12.2014