vue router 傳參獲取不到的解決方式
更新時間：2019年11月13日 16:36:23 作者：lzcwds
今天小編就為大家分享一篇vue router 傳參獲取不到的解決方式，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
在當前路由中有一個toArticle方法可以跳轉(zhuǎn)到article頁面
methods:{
toArticle:function(index) {
this.$router.push({path:'/article',params:this.blogList[index]});
}
}
在article中接受不到params
mounted(){
console.log(this.$route.params)
//這里輸出undifined
}
導致這樣的原因是因為params需要通過name來獲取，這里就要明白query和params的區(qū)別了
query要用path來引入,接收參數(shù)都是this.$route.query.name。query類似于ajax中get傳參，即在瀏覽器地址欄中顯示參數(shù)。
params要用name來引入，接收參數(shù)都是this.$route.params.name。params則類似于post，即在瀏覽器地址欄中不顯示參數(shù)。
所以以上帶面做下面這樣的修改就可以獲取數(shù)據(jù)：
methods:{
toArticle:function(index) {
this.$router.push({name:'article',params:this.blogList[index]});
}
}
以上這篇vue router 傳參獲取不到的解決方式就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關文章
正常情況下Vue推薦用props向子組件參數(shù),但是在特定場景下,使用$attrs會更方便,下面這篇文章主要給大家介紹了關于vue2.x中$attrs使用的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2022-11-11
淺談vue3中ref、toRef、toRefs?和?reactive的區(qū)別
本文主要介紹了淺談vue3中ref、toRef、toRefs?和?reactive的區(qū)別，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-07-07
這篇文章主要介紹了vue異步請求數(shù)據(jù)重新渲染方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-01-01
這篇文章主要給大家介紹了關于VUE配置history路由模式配置的相關資料,History模式是Vue路由的另一種模式,在History模式下URL中的路徑不再使用#符號,而是直接使用正常的路徑形式,需要的朋友可以參考下2023-12-12
Vue props 單向數(shù)據(jù)流的實現(xiàn)
這篇文章主要介紹了Vue props 單向數(shù)據(jù)流的實現(xiàn)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
vue3 + vite + ts 中使用less文件全局變量的操作方法
這篇文章主要介紹了vue3 + vite + ts 中使用less文件全局變量的操作方法,本文通過實例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-03-03
vue-router報錯:uncaught error during route
這篇文章主要介紹了vue-router報錯:uncaught error during route navigati問題及解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
但隨著vue3版本的到來，對typescript的支持度越來越高，tsx語法也被大部分人越來越接收，所以很多項目都是搭配 Vue3 + TS 進行的，這篇文章主要介紹了一文掌握在Vue3中書寫TSX的方法,需要的朋友可以參考下2023-05-05
這篇文章主要介紹了vue2項目中如何使用clipboard復制插件方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-07-07
vue+Java后端進行調(diào)試時解決跨域問題的方式
今天在開發(fā)中遇到有點小問題，vue+Java后端進行調(diào)試時如何解決跨域問題，下面小編給大家分享解決方法，感興趣的朋友一起看看吧2017-10-10