美文网首页
vue-router

vue-router

作者: 面具猴 | 来源:发表于2019-05-31 14:13 被阅读0次

    使用平级组件

    1.定义两个vue组件
    2.在父组件中import导入这两个组件
    3.导入路由组件vue-router
    4.定义路由对象并把两个vue组件注册到对象中

    var router = new VueRouter({
      routes:[
       {path: '/account',component: account},
       {path: '/goodslist',component: goodslist}
      ]
    })
    

    5.把路由对象注册到父vue组件中

    new Vue({
      router: router
    })
    

    6.在父vue组件的模板中使用
    <router-link to="/count"></router-link>
    <router-view></router-view>

    7.定义默认路由组件

    使用子组件

    其他地方和平级相同
    定义父组件时
    var router = new VueRouter({
    routes:[
    {
    path: '/account',
    component: account,
    children: [
    {path: '/login',component: login},
    {path: '/register',component: register}
    ]
    },
    {path: '/goodslist',component: goodslist}
    ]
    })

    相关文章

      网友评论

          本文标题:vue-router

          本文链接:https://www.haomeiwen.com/subject/kpxspftx.html