路由之vipspa.js初步理解

## 在这里说明这些仅是个人理解,仅供参考 ##

最近做了一个项目,在这个项目中用到了路由,这是我首次接触路由,感觉这是前端开发中必须要了解的一个插件。该插件是:vipspa.js
## 引用 ##
该插件的引用很简单,和一般的插件的引用一样,前提是必须引用jqury。
## 使用 ##
使用也是相当简单,主要是div和js的配合,样式在这里不多说,根据自己的页面需求设计页面即可。
*div*
在div里面需要一个列表,来表示自己需要跳转页面的不同的分类,在这个列表里面需要使用`a`标签,实例如下:


同时,还需要一个使用一个标签来进行跳转内容的展示

*js*
在js文件里面需要设置自己根据不同的列表项选择跳转的页面,先说代码:
vipspa.start({
            view: '#content',// 页面路由的div
            router: {
                '/sy': {
                    templateUrl: 'webApp/v1/v1.html',
                    controller: 'webApp/v1/v1.js'
                },
                '/one': {
                    templateUrl: 'webApp/v2/v1.html',
                    controller: 'webApp/v2/v1.js'
                },
                '/two': {
                    templateUrl: 'webApp/v3/v1.html',
                    controller: 'webApp/v3/v1.js'
                },
                '/three': {
                    templateUrl: 'webApp/v4/v1.html',
                    controller: 'webApp/v4/v1.js'
                },
                'defaults': '/sy'     
            },
            errorTemplateId: '#error'//错误显示页面
        });

view:需要展示内容的部分
templateUrl:跳转页面的URL
controller:控制该跳转页面的js文件
defaults:当其他页面跳转出错时,默认跳转到的页面

以上就是vipspa.js的简单使用,当然这个仅仅是简单的引用使用,路由还可以进行参数的传递。这个会在以后的文章里面进行说明。

github上面有插件下载和该插件的一些方法,点击这里
希望对做WEB系统的童靴有帮助!

你可能感兴趣的:(javascript,路由,插件)