vue.js路由学习笔记 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <script src="https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.js"></script>
        <script src="https://cdn.bootcss.com/vue-router/2.0.1/vue-router.js"></script>
    </head>
    <body>
        <div id ="app">
            <div>
                <router-link to="/home">主页</router-link>
                <router-link to="/news">新闻</router-link>
            </div>
            <div>
                <router-view></router-view>
            </div>
            
        </div>
        
    </body>
    <script>
        var Home={
            template:'<h3>我是主页</h3>'
        };
        var News={
            template:'<h3>我是新闻</h3>'
        };
        
        var router =new VueRouter({
            routes :[
                {path:'/home',component:Home},
                {path:'/news',component:News},
                ]
            
        });
        
        new Vue({
            router,
            el:'#app'
            
        });
    </script>
</html>

特别注意版本,之前学习时候是2.0.1,后来改了版本,发觉不可以i用了,等过几天进行更新下学习下

posted @ 2019-02-03 00:34  菩提树下的丁春秋  阅读(249)  评论(0)  编辑  收藏  举报