vue學習日記 vue路由搭建

2022-01-15 07:22:02 字數 913 閱讀 6111

vue路由搭建參考了iview-admin的路由搭建風格。在router資料夾下新建router.js檔案，**如下：

import login from '@/components/login';


import main from '@/components/main';


//不作為main元件的子頁面展示的頁面單獨寫，如下


export const loginrouter =,


component: login


};//


作為main元件的子頁面展示但是不在左側選單顯示的路由寫在otherrouter裡


export const otherrouter =


]};// 


]}];


//所有上面定義的路由都要寫在下面的routers裡


export const routers =[


loginrouter,


otherrouter


];
在index.js中引入router.js。**如下：

import vue from 'vue';


import router from 'vue-router';


import from './router';


vue.use(router);


//路由配置


const routerconfig =;


export 


default


new router(routerconfig);
以後關於路由攔截的部分就寫入index.js中。

專案結構截圖：

vue專案路由搭建

找到專案中src router，並在其下建立乙個index.js檔案 之後引入檔案和編寫路由 import vue from vue import router from vue router export const constantroutes children export default r...

Vue路由學習

在檢視 vue 教程中，摘抄的筆記，僅供自己回顧用 實際生活中的應用介面，通常由多層巢狀的元件組合而成。同樣地，url 中各段動態路徑也按某種結構對應巢狀的各層元件 摘抄自 示例 相當於，在大的 router view 中又存在可替換的元件 定義 新增了 children 的配置 除了使用 建立 a...

vue路由學習

go to foo go to bar 0.如果使用模組化機制程式設計，匯入vue和vuerouter，要呼叫 vue.use vuerouter 1.定義 路由 元件。可以從其他檔案 import 進來 const foo const bar 2.定義路由 每個路由應該對映乙個元件。其中 comp...