Vue-router 类似Vuex实现组件化开发的示例


Posted in Javascript onSeptember 15, 2017

本文介绍了Vue-router 类似Vuex实现组件化开发的示例,分享给大家,具体如下:

随着项目越来越大,把所有route写在一个文件里就显得杂乱。

#单个组件路由
import a from '../components/a'
export default {
 path: '/a',
 name: 'a',
 component: a
}
import arouter from 'xxx'
export default new Router({
 routes: [
   arouter
 ]
})

#多个组件路由
import a from '../components/a'
import b from '../components/b'
export default [{
 path: '/a',
 name: 'a',
 component: a
}, {
 path: '/b',
 name: 'b',
 component: b
}]
#arouter.js
export default new Router({
 routes: [
  ...arouter//扩展运算符
 ]
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 学习小结(适合新手参考)
Jul 30 Javascript
Javascript学习之谈谈JS的全局变量跟局部变量(推荐)
Aug 28 Javascript
jQuery倒计时代码(超简单)
Feb 27 Javascript
mui上拉加载功能实例详解
Apr 13 Javascript
浅谈angular4生命周期钩子
Sep 05 Javascript
JS实现点击链接切换显示隐藏内容的方法
Oct 19 Javascript
JavaScript 判断iPhone X Series机型的方法
Jan 28 Javascript
详解微信小程序实现仿微信聊天界面(各种细节处理)
Feb 17 Javascript
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
file-loader打包图片文件时路径错误输出为[object-module]的解决方法
Jan 03 Javascript
JavaScript 判断数据类型的4种方法
Sep 11 Javascript
vue使用wavesurfer.js解决音频可视化播放问题
Apr 04 Vue.js
vue用addRoutes实现动态路由的示例
Sep 15 #Javascript
Vue渲染函数详解
Sep 15 #Javascript
JavaScript中如何判断一个值的类型
Sep 15 #Javascript
详解利用 Vue.js 实现前后端分离的RBAC角色权限管理
Sep 15 #Javascript
动态创建Angular组件实现popup弹窗功能
Sep 15 #Javascript
Vue2.0基于vue-cli+webpack Vuex的用法(实例讲解)
Sep 15 #Javascript
angular4模块中给标签添加背景图的实现方法
Sep 15 #Javascript
You might like
thinkphp在模型中自动完成session赋值示例代码
2014/09/09 PHP
PHP针对伪静态的注入总结【附asp与Python相关代码】
2017/08/01 PHP
Javascript 八进制转义字符(8进制)
2011/04/08 Javascript
jQuery学习总结之元素的相对定位和选择器(持续更新)
2011/04/26 Javascript
深入理解JavaScript是如何实现继承的
2013/12/12 Javascript
详解AngularJS中的依赖注入机制
2015/06/17 Javascript
jquery图片倾斜层叠切换特效代码分享
2015/08/27 Javascript
jQuery多级手风琴菜单实例讲解
2015/10/22 Javascript
JS与jQ读取xml文件的方法
2015/12/08 Javascript
详细谈谈javascript的对象
2016/07/31 Javascript
两种JavaScript的AES加密方式(可与Java相互加解密)
2016/08/02 Javascript
JS之相等操作符详解
2016/09/13 Javascript
详解nodejs 文本操作模块-fs模块(一)
2016/12/22 NodeJs
js实现动态显示时间效果
2017/03/06 Javascript
使用Vue自定义指令实现Select组件
2018/05/24 Javascript
webpack打包非模块化js的方法
2018/10/24 Javascript
详细教你微信公众号正文页SVG交互开发技巧
2019/07/25 Javascript
搭建Vue从Vue-cli到router路由护卫的实现
2019/11/14 Javascript
jQuery操作选中select下拉框的值代码实例
2020/02/07 jQuery
ES6中Promise的使用方法实例总结
2020/02/18 Javascript
[02:16]卖萌的僵尸 DOTA2神话信使飞僵小宝来袭
2014/03/24 DOTA
Python入门之三角函数sin()函数实例详解
2017/11/08 Python
解决sublime+python3无法输出中文的问题
2018/12/12 Python
PyQt5 实现给窗口设置背景图片的方法
2019/06/13 Python
pytorch梯度剪裁方式
2020/02/04 Python
使用CSS3制作一个简单的Chrome模拟器
2015/07/15 HTML / CSS
Html5页面中的返回实现的方法
2018/02/26 HTML / CSS
Paper Cape官网:美国婴儿和儿童服装品牌
2019/11/02 全球购物
易程科技软件测试笔试
2013/03/24 面试题
求职信写作要突出重点
2014/01/01 职场文书
全陪导游欢迎词
2014/01/17 职场文书
计算机专业毕业生求职信
2014/04/30 职场文书
球队口号
2014/06/18 职场文书
高中生思想道德自我评价
2015/03/09 职场文书
聚会通知怎么写
2015/04/23 职场文书
2019年大学生职业生涯规划书
2019/03/25 职场文书