无法使用 requirejs 扩展主干视图答案

【问题标题】：Backbone views unable to extend using requirejs无法使用 requirejs 扩展主干视图
【发布时间】：2013-03-07 03:01:20
【问题描述】：

我熟悉构建主干应用程序，但正在尝试将其转换为使用 requirejs，我面临的问题是当我尝试扩展父视图时，它是 undefined

当尝试将 base-view.js 扩展到 properties-view.js 时

 define(['backbone','underscore','jquery','views/node/base-view'],                  
   function(Backbone, _, $, NodeBaseView){
     PropertiesView = NodeBaseView.extend({

        });
     }
});

在父基础视图中实例化子视图

    define(['backbone','underscore','jquery','views/node/properites-view'], function(Backbone, _, $, PropertiesView){
    NodeBaseView = Backbone.View.extend({
    ..
        new PropertiesView({});
    ..
    });

});

这里的 NodeBaseView 是 undefined，当它试图为 PropertiesView 扩展它时。有什么帮助吗？

注意：我使用 AMD 版本的主干和下划线从这里https://github.com/amdjs

【问题讨论】：

您确定要返回视图吗？就像最后的return NodeBaseView;一样。
这可能是解决方案。我在六个多月前解决了这个错误，现在不记得了。

标签： javascript backbone.js requirejs amd

【解决方案1】：

您可以动态要求 PropertiesView，这样 BaseView 就不必依赖它。

define(['backbone','underscore','jquery','views/node/base-view'],
   function(Backbone, _, $, NodeBaseView){
     PropertiesView = NodeBaseView.extend({

        });
     }
     return PropertiesView;
});

这里你需要PropertiesView

define(['backbone','underscore','jquery'],
    function(Backbone, _, $, PropertiesView){
        NodeBaseView = Backbone.View.extend({
        ..
            var PropertiesView = require('views/node/properites-view');
        ..
            new PropertiesView({});
        ..
        });

});

例子：

define(['views/node/base-view', 'views/node/properites-view'],
    function(NodeBaseView, PropertiesView){
        return {
            base: new NodeBaseView()
        }
});

【讨论】：

【解决方案2】：

让我们假设这个定义位于“views/main”中

define(['backbone', 'views/node/base'],                          
    function(Backbone, BaseView){
        var MainView = BaseView.extend({

        });

        return MainView;
    }
);

然后作为您的孩子视图：

define(['backbone', 'views/node/base'],                          
    function(Backbone, BaseView) {
        var PropertiesView = BaseView.extend({

        });

        return PropertiesView;
    }
);

然后在遥远的宇宙中的某个地方：

myView = new MainView();

使用手册中的示例：

define(['backbone', 'views/node/base'],                          
    function(Backbone, BaseView){
        var MainView = BaseView.extend({

        });

        return MainView;
    }
);

然后

define(['backbone'], function (Backbone) {                  
  var BaseView;

  require(['views/node/base'], function(b){
      BaseView = b;
  });

  var PropertiesView = BaseView.extend({

  });

  return PropertiesView;
});

【讨论】：

就我而言，是的，我正在返回“PropertiesView”。似乎我不应该从父母实例化一个孩子，但我真的想不出另一种方法让父母意识到它的孩子。
原则上从父视图实例化子视图没有错。您也可以使用 CommonJS 格式，或者只需要其中一个视图。请参阅 redolent 的示例：stackoverflow.com/questions/4881059/…

【解决方案3】：

这里的问题似乎是循环依赖。基础视图需要属性视图，反之亦然。这会导致其中一个未定义。

【讨论】：

我明白这一点。然而，普通版本的主干没有这个问题，扩展视图是其中一项功能。知道如何在这里解决这个问题
好吧，要明确一点，除非我完全误解了这个问题，否则您遇到的问题与 Backbone 无关。而是你如何使用require。 AMD 中不允许循环依赖。（如果我错了，有人纠正我。）即使你没有使用 require，对我来说，父视图依赖于子视图似乎很奇怪。不是想告诉你什么对你的代码最好，只是说我认为依赖库不允许它是有正当理由的。如果是我，我会通过简单地使用三个视图来解决这个问题。
它是想要扩展父视图的子视图（不是扩展子视图的父视图）。想知道是否有人有使用 AMD 与主干和扩展父视图到子视图以使用父方法和事件处理的经验。
@GokulKav 我在这里遇到了同样的情况。你有办法解决吗？所以我无法从父级实例化子视图？如果没有，我怎样才能以不同的方式获得相同的行为？
根据 James Burke 在此处的评论，这通常是 AMD 格式的限制：stackoverflow.com/questions/4881059/…