Блог

Главная - Вопросы по программированию - Как вы добавляете свои вложенные представления в Backbone?

Как вы добавляете свои вложенные представления в Backbone?

#backbone.js

#backbone.js

Вопрос:

У меня есть приложение Backbone, которое отображает несколько связанных представлений на каждой странице, на которую вы переходите. Например, на одной странице отображаются следующие представления:

  • Контекстная строка
    • Выпадающие меню
    • Разбивка на страницы
  • Основная таблица
    • Строки таблицы

Основной вид таблицы здесь является первым, который мой маршрутизатор добавляет в DOM — в этом представлении reset привязан к appendRows функции внутри него, которая добавляется в каждую строку таблицы:

 // Instantiate the view, render and append it to the DOM
var tableView = new TableView({ collection: blahCollection });
$("main").append(tableView.render().el);

// Fetch the latest data for the collection (triggers a reset which appends rows)
blahCollection.fetch();

Мне это кажется логичным, однако, когда дело доходит до добавления, например, вложенного представления с разбивкой на страницы, я задаю себе вопрос: «Должно ли представление действительно контролировать то, что добавляется на экран»?

Поэтому, учитывая пример разбивки на страницы:

  • Должно ли представление (в данном случае главное табличное представление) контролировать, как / когда разбивка на страницы добавляется к DOM?
  • Должен ли маршрутизатор? Если да, то должен ли он вызывать функцию в родительском представлении для этого — или логика должна быть полностью вне основного представления?

Ответ №1:

Мне нравится позволять моему маршрутизатору выполнять многие высокоуровневые функции за меня. Например, я настрою базовый макет … что-то вроде этого:

 <body>
    <div id="contextBar">
        <div id="menus"></div>
        <div id="pagination"></div>
    </div>
    <div id="mainTable"></div>
</body>

Затем в моем обработчике маршрутизатора я бы подключил представления, которые не связаны друг с другом:

 var contextView = new ContextView({el: $("#contextBar")});
var menusView = new MenusView({el: $("#menus")});
var paginationView = new PaginationView({el: $("#pagination")});
var tableView = new MainTableView({el: $("#mainTable")});

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

По крайней мере, именно так я организовываю свой код с помощью Backbone.

Комментарии:

1. Я делаю различие между маршрутизируемыми представлениями и вложенными представлениями. Обычно для маршрутизируемых представлений у меня есть родительский класс, который обрабатывает отображение / скрытие, используя шаблон «когда (скрыть все представления).затем (показать это представление)».