码迷,mamicode.com
首页 > 其他好文 > 详细

Vue:路由router的一些用法

时间:2018-01-17 18:13:12      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:one   win   rect   zh-cn   lob   官方   pat   imp   component   

 

Vue-router的引入

分为两种方式:

1.通过npm 引入vue-router库

npm install vue-router

在模块中通过下面的方法使用

import Vue from ‘vue‘
import VueRouter from ‘vue-router‘

Vue.use(VueRouter)

2.直接通过script标签引入vue-router.js文件

如果是通过script标签引入,则直接使用即可。

下载地址

router的使用

var routes = [
        {
            path:‘/home‘,
            component:home,
            name:"home"
        },
        {
            path:‘/order‘,
            component:order,
            name:"order",
            redirect:‘/order/all‘,  /*默认子路由*/
            children:[
                {
                    path:‘all‘,
                    component:all,
                    name:‘allOrder‘
                },
                {
                    path:‘having‘,
                    component:having,
                    name:‘havingOrder‘
                },
                {
                    path:‘had‘,
                    component:had,
                    name:‘hadOrder‘
                }
            ]
        },
        {path:‘/self‘,component:_self,name:"self"}
    ]

这里是我自己的一些应用心得。如果有什么问题,欢迎留言~

官方文档

Vue:路由router的一些用法

标签:one   win   rect   zh-cn   lob   官方   pat   imp   component   

原文地址:https://www.cnblogs.com/WQLong/p/8298291.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!