本文概述
当路由匹配其相应的回调时,将在路由器内部调用Backbone.js execute方法。
句法:
router.execute(callback, args)
参数说明
callback:与路由匹配时执行。
args:它指定在execute方法内传递的参数。
让我们举个例子。
请参阅以下示例:
<!DOCTYPE html>
<head>
<title>Router Example</title>
<script src="https://code.jquery.com/jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js" type="text/javascript"></script>
</head>
<script type="text/javascript">
var Route1 = Backbone.View.extend({
template: '<b>This is route 1</b>', initialize: function () {
this.execute();
}, execute: function () {
this.$el.html(this.template);
}
});
var Route2 = Backbone.View.extend({
template: '<b>This is route 2</b>', initialize: function () {
this.execute();
}, execute: function () {
this.$el.html(this.template);
}
});
var AppRouter = Backbone.Router.extend({
routes: {
'': 'homeRoute', 'route/1': 'homeRoute', 'route/2': 'aboutRoute', }, homeRoute: function () {
var route1 = new Route1();
$("#content").html(route1.el);
}, aboutRoute: function () {
var route2 = new Route2();
$("#content").html(route2.el);
}
});
var appRouter = new AppRouter();
Backbone.history.start();
</script>
<body>
<div id="navigation">
<a href="#/route/1">route1</a>
<a href="#/route/2">route2</a>
</div>
<div id="content"></div>
</body>
</html>
输出:
将上面的代码保存在execute.html文件中,然后在新的浏览器中打开该文件。
评论前必须登录!
注册