Backbone.js:何时在导航路线时渲染视图

vik*_*tra 3 routes views backbone.js

以下是我的骨干应用程序的要求

  • 显示用户已创建的文件夹列表
  • 单击文件夹时显示文件夹的内容

这是我实现它的方式.

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
    }
});
Run Code Online (Sandbox Code Playgroud)

这种方法给我带来了问题,因为当我点击文件夹时,路径会保存在浏览器历史记录中并且结构为'domain.com#get/folder/1`.如果我碰巧将此URL粘贴到浏览器的地址栏中,则不会呈现文件夹列表,因为它与路径不匹配.

initialize路由器功能中显示文件夹列表是否是一种智能策略?可能会创建一个页面视图,检查文件夹是否已经显示?

dir*_*ira 5

如果我理解正确,应永久显示文件夹列表.您的应用程序有两个大视图,文件夹列表和内容.并且必须始终显示文件夹列表.

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)
  }
})
Run Code Online (Sandbox Code Playgroud)