Backbone Require.js 单页应用程序不工作，除非刷新答案

【问题标题】：Backbone Require.js Single Page App Not Working Unless RefreshBackbone Require.js 单页应用程序不工作，除非刷新
【发布时间】：2014-04-21 23:35:15
【问题描述】：

我正在将 require.js 与单页主干.js 应用程序一起使用。在利用 require.js 之前，我可以单击链接，页面内容将按预期加载而无需刷新，但现在，除非我刷新页面，否则它不会加载。

这是我的索引页：

<body>
<header></header>
<nav>
    <a href="#/1">World</a>
    <a href="#/2">Business</a>
    <a href="#/3">Opinion</a>
    <a href="#/4">Sports</a>
    <a href="#/5">Fashion & Style</a>
    <a href="#/6">Video</a>
</nav>
<section id="container"></section>
<footer></footer>



<!-- Templates -->
<script type="text/template" id="featuredarticles">
    <h2>This is the main content</h2>
    <ul id="test"></ul>
 </script>

<script type="text/template" id="contentarticles">
    <h2>This is a page</h2>
    <ul id="test2"></ul>
</script>

<!-- Require.js reference -->
<script src="/js/libs/require.js" data-main="/js/app.js"></script>

这是我的 app.js 页面，其中包含 require.js 配置：

require.config({
paths: {
    jquery: "libs/jquery-2.1.0.min",
    underscore: "libs/underscore-min",
    backbone: "libs/backbone-min",
},
shim: {
    underscore: {
        exports: "_"
    },
    backbone: {
        deps: ['underscore', 'jquery'],
        exports: 'Backbone'
    },
}
});

require(['routers/siteRouter'], function(router) {
 new router;
});

这是我的路由器：

define(['underscore', 'backbone', 'views/featuredArticlesView', 'views/contentArticlesView'], function (_, Backbone, featuredArticlesView, contentArticlesView) {

var siteRouter = Backbone.Router.extend({
    routes: {
        '': 'featuredArticlesView',
        '1': 'contentArticlesView',
        '2': 'contentArticlesView',
        '3': 'contentArticlesView',
        '4': 'contentArticlesView',
        '5': 'contentArticlesView',
        '6': 'contentArticlesView'
    }
});
var router = new siteRouter();
router.on('route:featuredArticlesView', function () {
    new featuredArticlesView();
});
router.on('route:contentArticlesView', function () {
    new contentArticlesView();
});

Backbone.history.start();

return siteRouter;
});

【问题讨论】：

标签： backbone.js requirejs

【解决方案1】：

修复它。我的路由器中有两个变量，只返回“siteRouter”。将这些包装在一个函数中解决了它。

define(['underscore', 'backbone', 'views/featuredArticlesView', 'views/contentArticlesView'], function (_, Backbone, featuredArticlesView, contentArticlesView) {

function routing() {

    var siteRouter = Backbone.Router.extend({
        routes: {
            '': 'featuredArticlesView',
            '1': 'contentArticlesView',
            '2': 'contentArticlesView',
            '3': 'contentArticlesView',
            '4': 'contentArticlesView',
            '5': 'contentArticlesView',
            '6': 'contentArticlesView'
        }
    });
    var router = new siteRouter();
    router.on('route:featuredArticlesView', function () {
        new featuredArticlesView();
    });
    router.on('route:contentArticlesView', function () {
        new contentArticlesView();
    });

    Backbone.history.start();
}
return routing;
});

【讨论】：