router-view 使用

最近用vue写网页,竟然忘了router-view 的使用,时间太久了,还是记录下。

是一个组件,它与router中的path相关联。可以通过router进而改变代表的具体vue页面。

比如在'/Root'对应的页面中使用,就需要在router.js中配置Root下 children[] 形成层级关系。

router-view 使用_第1张图片

该页面使用

对下面进行控制。

router的.js: 

 {
      path: '/dosomething',
      name: 'Dosomething',
      component: Dosomething,
       children:[{
        path:'/dosomething/book',
        name:'book',
        component:Book
      },{
        path:'/dosomething/sport',
        name:'sport',
        component:Sport
      },{
        path:'/dosomething/plan',
        name:'plan',
        component:Plan
      },{
        path:'/dosomething/tools',
        name: 'tools',
        component: Tools
      }
      ]

    }

menu标签

@on-select="selectMenu"

方法

selectMenu(name) {

this.$router.push(name)

}

从而实现页面内的二级跳转

 

你可能感兴趣的:(fronted,router-view)