backbone.js路由器扩展extend

本文概述

  • 参数说明
Backbone.js路由器扩展方法用于扩展路由器类并创建从Backbone.Router继承的新构造函数。当特定的URL片段匹配时,它定义了一些触发的动作,并为这些动作提供了路由。
句法:
Backbone.Router.extend(properties, classProperties)

参数说明
  • properties:它指定路由器类的实例属性。
  • classProperties:它指定附加到路由器的构造函数的类属性。
让我们举个例子。
请参阅以下示例:
< !DOCTYPE html> < head> < title>Router Extend Example< /title> < script src="http://img.readke.com/220416/0610495M6-0.jpg" type="text/javascript">< /script> < script src="http://img.readke.com/220416/06104932Z-1.jpg" type="text/javascript">< /script> < script src="http://img.readke.com/220416/061049E55-2.jpg" type="text/javascript">< /script>< script type="text/javascript"> var RouteMenu = Backbone.View.extend({ el: '#routemenu', //'el' defines which element to be used as the view reference events: { 'click a' : 'onClick' }, onClick: function( e ) { router.navigate('/'); } }); var Router = Backbone.Router.extend({ routes: { 'route/:id' : 'defaultRoute' }, }); var routemenu = new RouteMenu(); Backbone.history.start(); < /script> < /head> < body>< section id="routemenu"> < ul> < li> < a href="http://www.srcmini.com/#/route/1">This is route no.1 < /a> < /li> < li> < a href="http://www.srcmini.com/#/route/2">This is route no. 2 < /a> < /li> < li> < a href="http://www.srcmini.com/#/route/3">This is route no. 3 < /a> < /li> < /ul> < /section> < /body> < /html>

【backbone.js路由器扩展extend】输出:
将以上代码保存在extend.html文件中,然后在新的浏览器中打开此文件。
backbone.js路由器扩展extend

文章图片

    推荐阅读