vue路由用法

2021-10-01 23:45:47 字數 610 閱讀 7438

父元件中:通過路由屬性中的name來確定匹配的路由,通過params來傳遞引數。

this.$router.push(

})

對應路由配置: 這裡可以新增:/id 也可以不新增,不新增資料會在url後面顯示,不新增資料就不會顯示 

子元件中: 這樣來獲取引數

this.$route.params.id
父元件:使用path來匹配路由,然後通過query來傳遞引數

這種情況下 query傳遞的引數會顯示在url後面?id=?

this.$router.push(

})

對應路由配置:

對應子元件: 這樣來獲取引數 

this.$route.query.id
顯示登入頁面

子路由元件通過this.$route.query.num 來顯示傳遞過來的引數

顯示登入頁面

子路由獲取的引數:}

vue路由的基本用法

doctype html en utf 8 路由基本用法 title router link active active style js vue.js script js vue router.js script head itany 使用router link元件來定義導航,to屬性指定鏈結ur...

vue路由的,基本用法

第一步 安裝路由 npm install router 第二步 新建路由,單獨資料夾 1 最好新建router名稱的資料夾,位置放在和pages一起 2 router資料夾下,新建index.js檔案 第三步 引入需要的外掛程式,和元件,在剛新建的index檔案裡 1 引入vue,和路由router...

vue路由配置,vue子路由配置

現在乙個專案已經部署完成,接下來我們從路由開始!還記得在初始化專案的時候,有提示是否需要安裝vue router,對沒錯,vue中路由全靠它!首先找到路由配置檔案 router index.js,是整個專案路由配置檔案 首先看最上面的,這個模組引入,es2015中的import.from.將你需要配...