Backbone.js: когда отображать представления при навигации по маршрутам - PullRequest
Новая
       19

Backbone.js: когда отображать представления при навигации по маршрутам

3 голосов
/ 25 октября 2011

Вот требования к моему основному приложению

  • отображать список папок, которые создал пользователь
  • отображать содержимое папки при нажатии на папку

Вот как я это реализовал. 

AppRouter = Backbone.Router.extend({
    routes: {
      '': 'home',
      'get/:name/:id': 'contents'
    },

    home: function() {
        // show list of folders
    },

    contents: function(name, id) {
        // show contents of clicked folder
    }
});

Этот подход доставляет мне проблемы, поскольку при нажатии на папку маршрут сохраняется в истории браузера и имеет структуру 'domain.com # get / folder / 1`. Если мне удастся вставить этот URL в адресную строку браузера, список папок не будет отображаться, поскольку он не соответствует маршруту.

Будет ли разумной стратегией отображать список папок в функции initialize маршрутизатора? может быть создать вид страницы, которая проверяет, были ли уже отображены папки или нет?

1 Ответ

5 голосов
/ 25 октября 2011

Если я правильно понимаю, список папок должен отображаться постоянно.И у вашего приложения есть два больших представления: список папок и содержимое.И список папок должен отображаться постоянно. 

var AppRouter = Backbone.Router.extend({
  // it's better to use REST names than custom ones
  routes: {
    '': 'index',
    'get/:id/:name': 'show'
  },

  initialize: function(options) {
    this.folders = new Folders(options.folders); // folders is your Backbone.Collection
    // always show the FoldersView, something like
    // new FoldersView({collection: this.folders, el: $('the folders container')})
  },

  index: function() {
     // probably clear the contents area, something like
     // $("#content").html('')
  }

  show: function(id, name) {
    var folder = this.folders.get(id);
    // create a view for this folder
    // and render it in the content area, something like 
    // view = new FolderView(model: folder)
    // $("#content").html(view.render().el)
  }
})
...