Магистральная смена модели View - PullRequest
Новая
       10

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

26 голосов
/ 21 декабря 2011

Я новичок в 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)
        })
}

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

  • (а) не отражает изменения модели в коллекция

  • (b) не вызывает (не изменяет) события, потому что связывание в Функция инициализации представления никогда не срабатывает, потому что это совершенно новая модель

  • (с) мне кажется хаком

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

Какая самая лучшая практика здесь?

Ответы [ 4 ]

15 голосов
/ 13 ноября 2012

Одно из ваших решений близко, чтобы быть в порядке: D

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

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

И это также вызовет model.on («изменение»).

8 голосов
/ 27 января 2012

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

1 голос
/ 21 декабря 2011

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

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

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

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

0 голосов
/ 22 октября 2013

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

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

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

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

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

...