1

是的，这只是清除缓存后的一两个初始浏览器加载。随后的刷新清除了问题。

我认为项目视图没有及时完全构建以在第一次加载时在集合视图中使用。但是他们正在刷新？不知道。

必须有一些关于代码序列或加载或加载时间本身的东西。没有把握。我正在通过 require.js 加载。

有两个集合 - 用户和消息。每个都在自己的集合视图中呈现。每个都有效，只是不是第一次或两次浏览器加载。

清除浏览器缓存后第一次加载控制台报告，例如：

“未捕获的 ReferenceError：未定义 MessageItemView”

一个简单的浏览器刷新就可以清除它。用户集合也是如此。它的集合视图表示它对其项目视图一无所知。但是一个简单的浏览器刷新，一切都很好。

我的视图（项目和集合）位于单独的文件中。那是问题吗？例如，这是我自己文件中的消息集合视图：

消息列表视图.js

    var MessageListView = Marionette.CollectionView.extend({
        itemView: MessageItemView,
        el: $("#messages")
    });

消息项视图位于单独的文件中：

消息视图.js

    var MessageItemView = Marionette.ItemView.extend({
        tagName: "div",    
        template: Handlebars.compile(
                '<div>{{fromUserName}}:</div>' +
              '<div>{{message}}</div>' +
        )
    });

然后在引用每个这些文件的主模块文件中，构建并显示集合视图：

main.js

    //Define a model
    MessageModel = Backbone.Model.extend();

    //Make an instance of MessageItemView - code in separate file, messagelistview.js
    MessageView = new MessageItemView();


    //Define a message collection 
    var MessageCollection = Backbone.Collection.extend({
        model: MessageModel    
    });

    //Make an instance of MessageCollection
    var collMessages = new MessageCollection(); 


    //Make an instance of a MessageListView -  code in separate file, messagelistview.js
    var messageListView = new MessageListView({
        collection: collMessages
    });

    App.messageListRegion.show(messageListView);

我只是把事情排序错了吗？我认为这是某种竞争条件，只是因为超过 3G 到 iPad 的项目视图总是未定义的。他们似乎从来没有及时建造。刷新一两次浏览器后，硬连线连接上的 PC 确实会成功。可能是加载时间还是浏览器的差异？PC 上的 Chrome IE 和 Firefox 似乎都表现出刷新行为的成功。iPad 上的 Safari 总是失败。

根据下面的评论，这是我的要求块：在文件 application.js 中

    require.config({
        paths: {
            jquery: '../../jquery-1.10.1.min',
            'jqueryui': '../../jquery-ui-1.10.3.min',
            'jqueryuilayout': '../../jquery.layout.min-1.30.79',
            underscore: '../../underscore',
            backbone: '../../backbone',
            marionette: '../../backbone.marionette',
            handlebars: '../../handlebars',
            "signalr": "../../jquery.signalR-1.1.3",
            "signalr.hubs": "/xyvidpro/signalr/hubs?",        
            "debug": '../../debug',
            "themeswitchertool": '../../themeswitchertool'
        },

        shim: {
            'jqueryui': {
                deps: ['jquery']
            },

            'jqueryuilayout': {
                deps: ['jquery', 'jqueryui']
            },

            underscore: {
                exports: '_'
            },

            backbone: {
                deps: ["underscore", "jquery"],
                exports: "Backbone"
            },

            marionette: {
                deps: ["backbone"],
                exports: "Marionette"
            },        

            "signalr": {
                deps: ["jquery"],
                exports: "SignalR"
            },

            "signalr.hubs": {
                deps: ["signalr"],
                exports: "SignalRHubs"
            },

            "debug": {
                deps: ["jquery"]
            },

            "themeswitchertool": {
                deps: ["jquery"]
            }
        }
    });


    require(["marionette", "jqueryui", "jqueryuilayout", "handlebars", "signalr.hubs", "debug", "themeswitchertool"], function (Marionette) {
        window.App = new Marionette.Application();

        //...more code

    })

最后，在使用创建相关集合视图的模块内部，外部文件依赖项列表如下：

    var dependencies = [
        "modules/chat/views/userview",
        "modules/chat/views/userlistview",
        "modules/chat/views/messageview",
        "modules/chat/views/messagelistview"
    ];

显然 itemViews 列在 collectionViews 之前。这对我来说似乎是正确的。不确定在定义之前需要 itemViews 的 collectionViews 的原因。为什么浏览器刷新后一切正常？

4

1 回答 1

1

您加载文件的顺序很可能是错误的：您需要在集合视图之前加载项目视图。

尝试将所有代码以正确的顺序放在同一个文件中，看看它是否有效。

我在 Marionette 上的书的免费预览也可以指导您显示收藏视图。

根据校准进行编辑：

为模块列出的依赖项不是线性加载的。这正是 RequireJS 旨在避免的。相反，正确加载文件（即以正确的顺序）的方法是定义RequireJS 将计算和加载的依赖“链”。

您需要做的是定义（例如）您的用户列表视图以依赖于用户视图。通过这种方式，它们将被 RequireJS 以正确的顺序加载。您可以在此处查看 RequireJS 应用程序的示例（来自RequireJS 和 Marionette 的书籍）。看看每个模块定义是如何定义它依赖于哪些模块的（因此 RequireJS 需要在之前加载）。再一次，在依赖数组中按顺序列出模块不会使它们按该顺序加载，您确实需要使用依赖链机制。

于 2013-10-25T06:42:46.137 回答