在創建項目后(不帶路由的項目)使用路由 項目步驟 1:安裝 cnpm install --save vue-router 2:新建配置文件 在src下創建router文件夾:內創建index.js 3:導入和掛在(都在根入口main.js): import router from "./router/index.js" //import router 的router 一定要小寫, 不要寫成Router, 否則報 can't match的報錯 const app = new Vue({ router, render: h => h(App), }).$mount('#app') 4:router/index.js配置文件添加配置 import Vue from "vue"; import VueRouter from "vue-router"; Vue.use(VueRouter); // 引入組件 import comform from "../components/comform.vue"; import comform2 from "../components/comform2.vue"; const routes = [ { path:"/tab1", component: comform }, { path: "/tab2", component: comform2 } ] var router = new VueRouter({ routes }) export default router; 5:使用 在想要使用展示路由的地方配置展示和配置跳轉項:如在app.js 入口處template模板 <template> <div id="app"> <!-- <my-form/> --> <router-link to="/tab1">顯示1</router-link> <router-link to="/tab2">顯示2</router-link> <router-view></router-view> </div> </template> 參考 https://www.cnblogs.com/SamWeb/p/6610733.html