Модель изменения магистрали View

Я новичок в Backbone и задаю следующий вопрос:

У меня есть набор моделей.

У меня есть отображение в виде коллекции, отображающее вкладки (с представлением каждой модели в коллекции).

У меня есть представление о модели (для содержимого).

У меня есть маршрутизатор с маршрутами.

То, что я пытаюсь достичь, - это функциональность вроде http://jqueryui.com/demos/tabs/

Я нажимаю на вкладку (модель коллекции), а затем хочу передать модель в представление содержимого, возможно, изменить ее и отразить изменения в коллекции.

Я придумал четыре решения:

В маршрутизаторе:

'switchCommunity': function(id) {
        // (a) set new model attributes
        this.view.community.model.set(communities.get(id));

        // (b) replace model
        this.view.community.model = communities.get(id);

        // (c) a custom function of the view changes its model
        this.view.community.changeModel(communities.get(id));

        // (d) a new view
        this.view.community = new View({
            model: communities.get(id)
        })
}

Проблема здесь

(a) не отражает изменения модели в Коллекция
(b) не вызывает события (изменения), поскольку привязка в инициализация функции представления никогда не запускается, поскольку она полностью новая модель
(c) кажется мне взломом
(d) каждый раз, когда я нажимаю на вкладку, создается новое представление (это проблема с производительностью?)

Какая здесь самая лучшая оценка?

Ответ 1

Одно из ваших решений - это нормально: D

Вот что вы хотите:

this.view.community.model.set(communities.get(id).toJSON());

И это вызовет model.on( "change" ).

Ответ 2

Почему вы думаете (c) - это взлом? Кажется, это хорошее место для инкапсуляции отвязывания старой модели и подключения нового.

Ответ 3

Backbone.Marionette плагин обеспечивает упрощенное решение вашей проблемы.

Он обеспечивает функциональность для Инициализации приложений, управления просмотром и агрегирования событий.

В сущности, это устраняет боль от скрытия и показывает несколько видов.

Вы можете прочитать это сообщение в блоге, чтобы узнать больше об этом.

Ответ 4

Короткий ответ: вы должны использовать d. Да, это не работает, но если вы не заметите замедление в пользовательском интерфейсе, вы не должны слишком беспокоиться. Вы должны закодировать что-то, что 1. всегда работает 2. не займет много времени, чтобы закодировать, чтобы вы могли перейти к кодированию других более важных функций.

Если/когда вам нужно больше производительности, вы можете взять дополнительное время для выполнения c. Чтобы быть наиболее эффективным, вы не должны уничтожать и повторно отображать шаблоны. Вы должны использовать jquery, чтобы вручную найти элементы в DOM и заменить их на новую модель. Когда вы вызываете:

view.$el = _.template(string, model);

Это очень маленький код, но много работы для браузера. Замена DOM на новую модель намного более эффективна.

Если вам нужно быть более эффективным, вы можете использовать объединение объектов. Я работаю над PerfView для магистрали, которая реализует множество оптимизаций. https://github.com/puppybits/BackboneJS-PerfView В коде содержится много рекомендаций, чтобы поддерживать лучшую производительность браузера.