javascript - 如何利用vue元件動態產生router-link

Question

{程式碼...} 目前的問題雖然這樣可行，但是在vue-router執行之前會報一個組件未註冊的錯誤，請教各位大大有沒有更好的動態實現方式原問題↓ 如上所示，需要動態生成側邊路由，然後執行vue-router去解析，但會出...

大家讲道理 · Answer

首先，Vue.component的第二個參數是一個配置對象，你這個寫法連JS語法都不符合。
其次，template配置應該是一個HTML程式碼的字串，所以改成：

Vue.component('sidebar', {
    template: 'Go to FooGo to Bar'
});

Update

（參考資料：https://router.vuejs.org/en/e...）

針對你說的都是引入的情況，程式碼做如下修改：
先依下列順序依序引入Vue和Vue-router

然後加入如下JS

// 在Vue里面注册VueRouter，这样可以在Vue里面使用``
Vue.use(VueRouter);

// 下面这一段是路由设置和应用根元素绑定，具体可以参照官方文档
// -----------------------------------
var routes = [ ... ]; // 这个是路由的配置，你自己写

// 定义路由VueRouter控件，其中，`{routes}`是`{routes: routes}`的简写，可能是ES6里面的新语法
var router = new VueRouter({routes});

// 创建Vue对象
var app = new Vue({
    el: '#app', // 假设绑定的根元素为#app
    router, // 此处也是简写
});

然後可以使用Vue.component()語句了，此時，因為註冊了Vue-Router組件，可以被識別。

目前的問題

#原問題↓

Update