gpt4 book ai didi

javascript - 覆盖路由功能(Backbone.js)

转载 作者:行者123 更新时间:2023-12-03 07:54:55 26 4
gpt4 key购买 nike

我试图覆盖路由函数Backbone.Router,这是我的代码:

router.js

(function($, Backbone, _, app){
var AppRouter = Backbone.Router.extend({
routes: {
'': 'home'
},
initialize: function (options) {
Backbone.history.start();
},
route: function (route, name, callback) {
var router = this;
if (!callback) callback = router[name];
var f = function() {
console.log("route before", route);
callback.apply(router, arguments);
console.log("route after", route);
}
return Backbone.Router.prototype.route.call(router, route, name, f);
}
});
app.router = AppRouter;
})(jQuery, Backbone, _, app);

app.js

var app = (function($){
var config = $('#config'),
app = JSON.parse(config.text());
$(document).ready(function(){
var router = new app.router();
});
return app;
})(jQuery);

index.html

<!DOCTYPE html>
<html>
<head></head>
<body>
<script src="{% static 'js/jquery.js' %}" type="text/javascript"></script>
<script src="{% static 'js/bootstrap.min.js' %}" type="text/javascript"></script>
<script src="{% static 'js/bootstrap.js' %}" type="text/javascript"></script>
<script src="{% static 'js/underscore.js' %}" type="text/javascript"></script>
<script src="{% static 'js/backbone.js' %}" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/json2/20150503/json2.min.js"></script>


<!--App js-->
<script id="config" type="text/json">
{
"models": {},
"collections": {},
"views": {},
"router": null,
"apiRoot": "{% url 'api-root' %}",
"apiLogin": "{% url 'api-token' %}"
}
</script>
<script src="{% static 'app-js/app.js' %}"></script>
<script src="{% static 'app-js/models.js' %}"></script>
<script src="{% static 'app-js/views.js' %}"></script>
<script src="{% static 'app-js/router.js' %}"></script>
</body>
</html>

但是,“之前”和“之后”没有打印在控制台上。

我正在关注 http://jsfiddle.net/nikoshr/EdLzh/ 上的代码

并且之前和之后打印在控制台上。

我还尝试替换父级“路线”的调用,

Backbone.Router.prototype.route.call(router, route, name, f);

AppRouter.__super__.route.apply(router, [route, name, callback]);

但是函数f仍然没有被调用。

我也尝试用

替换相同的语句
Backbone.Router.prototype.route.apply(router, [route, name, f]);

还有

Backbone.Router.prototype.route.apply(this, [route, name, f]);

还有

Backbone.Router.prototype.route.callback(this, route, name, f);

但浏览器控制台中仍然没有调用函数 f。

请帮忙。

最佳答案

首先,您的路由器未设置 home 回调,但覆盖假定此回调存在,并在执行时以错误结束。

例如,尝试添加防护措施

route: function (route, name, callback) {
var router = this;
if (!callback) callback = router[name];

// adds a default function that will intercept the missing callbacks
if (!callback) {
callback = function() {
console.log('Route ' + name + ' not defined');
}
}

var f = function() {
console.log("route before", route);
callback.apply(router, arguments);
console.log("route after", route);
}
return Backbone.Router.prototype.route.call(router, route, name, f);
}

演示 http://jsfiddle.net/nikoshr/a78n9rj1/2/

其次,请注意,路由必须通过 routes 哈希或通过 Router.route 定义。对于该函数中发生的事情,它不会捕获所有哈希更改。

关于javascript - 覆盖路由功能(Backbone.js),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34838012/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com