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

How to resolve circular dependencies with nested views in Backbone.js

本文关键字：视图 嵌套 解决 循环 关系 依赖 Backbone js      更新时间：2023-09-26

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

此外，我还有一个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未定义"，这并不完全出乎意料。

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

https://stackoverflow.com/a/6476507

在主干js 的视图中嵌套视图

由于您没有在MenuItemView的类定义中使用MenuItemsView，因此应该不会有任何问题。尝试更改

childView = new MenuItemsView

收件人：

childView = new exports.MenuItemsView

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

相关文章：