哈哈哈666666 2019-04-26 13:27 采纳率: 0%
浏览 354
已结题

vue路由器,初学这样写,不知道错哪了??

vue路由器,初学这样写,不知道错哪了??

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/vue-router/2.7.0/vue-router.min.js"></script>
</head>
<body>
    <div id="app">
        <div class="list-group">
            <a class="list-group-item" v-link="{ path: '/home'}">Home</a>
            <a class="list-group-item" v-link="{ path: '/about'}">About</a>
        </div>
        <router-view></router-view>
    </div>
</body>
<script>
    var Home = Vue.extend({
        template: '<div><h1>Home</h1><p>{{msg}}</p></div>',
        data: function() {
            return {
                msg: 'Hello, vue router!'
            }
        }
    })

    var About = Vue.extend({
        template: '<div><h1>About</h1><p>This is the tutorial about vue-router.</p></div>'
    })
    var router = new VueRouter({
        routes:[
        { path: '/home', component: Home },
        { path: '/about', component: About }
        ]

    });
    new Vue({
        el:"#app",
        router
    })
</script>
</body>
</html>
  • 写回答

3条回答 默认 最新

  • 萤火微醺 2019-04-26 13:56
    关注
    配置
          const router = new VueRouter({
          // router
          routes:[
            {
              path:'/hello',
              component:HelloWorld
            }
          ]
        })
    注入
        new Vue({
          el: '#app',
          router, // 注入
          components: { App }, 
          template: '<App/>'
        })
    
    评论

报告相同问题?

悬赏问题

  • ¥60 版本过低apk如何修改可以兼容新的安卓系统
  • ¥25 由IPR导致的DRIVER_POWER_STATE_FAILURE蓝屏
  • ¥50 有数据,怎么建立模型求影响全要素生产率的因素
  • ¥50 有数据,怎么用matlab求全要素生产率
  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?