Question

我正在使用Brunch和Backbone.js构建一个包含嵌套菜单的应用程序。我创建了一个MenuItemModel和一个MenuItemsCollection，它们都扩展了相应的Backbone-base-objects。

此外，我还有一个MenuItemView（用于单个项目）以及一个MenuItemsView（用于项目集合）。剥下来，他们看起来像这样：

class MenuItemView extends Backbone.View
  tagName: 'li'

  initialize: (options) ->
      if @model.get('children')?
          childCollection = new MenuItemList
          childView = new MenuItemsView
              el: $('<ul>').appendTo @el
              collection: childCollection

class exports.MenuItemsView extends Backbone.View
    initialize: (options) =>
        @collection.bind 'add', @add

    add: =>
        view = new MenuItemView { model: @collection.last() }

正如您所看到的，两个视图之间存在循环依赖关系，并且完全出乎意料地，“childView = new MenuItemsView”行导致我的JS控制台中出现“Uncaught ReferenceError：MenuItemsView is not defined”。

我的问题是，有没有办法解决这个问题？我可以在代码中稍后通过递归函数创建嵌套菜单，但这似乎并不像我想的那样整洁和自包含。另外，我在SOF上发现了以下两个实例，人们建议使用与上面代码完全相同的嵌套视图。我做错了什么？

https://stackoverflow.com/a/6476507

Nesting Views within Views in backbone js

Answer 1

由于您未在MenuItemsView的类定义中使用MenuItemView，因此不会出现任何问题。尝试更改

childView = new MenuItemsView

要：

childView = new exports.MenuItemsView

看起来您将MenuItemsView放入exports命名空间，但initialize正在其自己的本地命名空间中查找名为MenuItemsView的类。

如何在Backbone.js中使用嵌套视图解决循环依赖关系

1 个答案: