Vue頁面跳轉方式及傳參總結

2021-09-25 01:18:18 字數 1134 閱讀 1224

路由配置

//路由配置  routerindex.js頁面


import vue from


'vue'


import router from


'vue-router'


import usermanager from


'@/components/usermanager'


vue.


use(router)


export


default


newrouter(]


})
1.標籤跳轉
"/usermanager"


>


>
//路由配置


path:


'/usermanager/:id'


,//跳轉頁面   this.id 需要傳的引數


"'/usermanager/' + this.id"


>


>


//接收引數


this


.$route.params.id
2.事件跳轉
methods:)}


}
相當於get請求，頁面跳轉時引數會在位址列中顯示

//跳轉頁面 


this


.$router.


push(}


)//接收引數


this


.$route.query.id
相當於post請求，頁面跳轉時引數不會在位址列中顯示

//跳轉頁面 


this


.$router.


push(}


)//接收引數


this


.$route.params.id
配置路由 在path加/:id對應需要傳的引數名

//路由配置


path:


'/usermanager/:id'


,
注意 ：傳參是router，接收引數是route

vue具體頁面跳轉傳參方式

1.寫資料，可以使用 以及setitems key,value 3種方式。例如 localstorage.name proe 設定name為 proe localstorage name proe 設定name為 proe 覆蓋上面的值 localstorage.setitem name proe ...

Vue頁面跳轉傳參

日期 2020年3月15日 1 通過router link進行跳轉，傳遞方式 使用query傳遞引數，路由必須使用path引入，使用params傳遞引數，路由必須使用name引入 跳轉位址 content?key hello value world 取值 this.route.query.key 跳...

Vue頁面跳轉時傳參總結

1 路由跳轉 跳轉到 path login 的頁面 2 路由跳轉時傳參 2.1 傳參的頁面中 2.2 引數接收 data 3 程式設計式頁面跳轉 this.router.push 跳轉到name為home的頁面 4 程式設計式頁面跳轉時傳參 4.1 params 傳參 相當於post請求，頁面跳轉時...