美文网首页
2018-09-26

2018-09-26

作者: 盛邦升华 | 来源:发表于2018-09-26 08:42 被阅读0次

1.

<router-link to='/home'>首页</router-link>
<router-link to='/user'>用户页</router-link> 

盛放链接对应的内容

<router-view></router-view>

2.创建组件

var Home={
           template:`
             <h1>这是首页</h1>
           `
       }
       
       var User={
           template:`
                <h1>这是用户页</h1>
            `
       }

3.配置路由

 const  routes=[
           {path:'/home',component:Home},
           {path:'/user',component:User}
       ]

4.创建路由实例

       const router=new VueRouter({
           routes:routes
       })

5.路由实例挂载到vue实例上

       new Vue({
           el:'#app',
           router:router
       })
       

相关文章

网友评论

      本文标题:2018-09-26

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