7 Vue 路由引數傳遞

2021-10-07 04:00:05 字數 1431 閱讀 6508

url路徑傳遞方式(vue動態路由匹配):www.***.com/user-url/123

url引數傳遞方式: www.***.com/user-query?id=123

vue params引數傳遞方式: 不改變url路徑,採用vue內部引數傳遞方式

>

>

url路徑方式傳遞引數h3

>

"/user-url/111"

>

字串—url路徑方式傳遞引數router-link

>

/>

:to=

"">

物件[path]—url路徑方式傳遞引數router-link

>

/>

>

url引數方式傳遞引數h3

>

"/user-query?id=333"

>

字串—url引數方式傳遞引數router-link

>

/>

:to=

"namequery"

>

物件[name+query]—url引數方式傳遞引數router-link

>

/>

:to=

"pathquery"

>

物件[path+query]—url引數方式傳遞引數router-link

>

/>

>

vue params方式傳遞引數h3

>

:to=

"nameparams"

>

物件[name+params]—params方式傳遞引數router-link

>

/>

:to=

"pathparams"

>

物件[path+params]—params方式傳遞引數router-link

>

/>

物件[path+params]方式組合無效,params方式只有物件[name+params]組合方式

>

router-view

>

div>

src=

"">

script

>

src=

"">

script

>

const userparams =}'

}const userquery =}'

}routes =[,

,,]router =

newvuerouter()

newvue(}

, pathquery:},

nameparams:},

pathparams:}}

}).$mount

()

vue路由傳遞引數

1.通過path來確定匹配的路由,通過query來傳遞引數 傳參 golist title,id 注意這裡是 router 接參 this.params.brandid this.route.query.id 這裡是 route2.通過路由屬性name確定匹配路由,通過params傳遞引數 傳參 g...

Vue 路由傳遞引數

vue 路由傳遞引數與 vue傳遞引數不同 vue router傳遞引數分為兩大類 程式設計式的導航 router.push 宣告式的導航 程式設計式的導航 router.push 程式設計式導航傳遞引數有兩種型別 字串 物件。字串字串的方式是直接將路由位址以字串的方式來跳轉,這種方式很簡單但是不能...

vue 路由傳遞引數

結構目錄 1.頁面傳值 不同之間的頁面傳值 1.1 index.js配置 原始碼 1 引入vue框架 2 import vue from vue 3 引入vue router路由依賴 4 import router from vue router 5 home 6 import home from ...