1. 程式人生 > >關於vue router 傳參獲取不到問題

關於vue router 傳參獲取不到問題

在當前路由中有一個toArticle方法可以跳轉到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的區別了

  • query要用path來引入,接收引數都是this.$route.query.name。query類似於ajax中get傳參,即在瀏覽器位址列中顯示引數。
  • params要用name來引入,接收引數都是this.$route.params.name。params則類似於post,即在瀏覽器位址列中不顯示引數。

所以以上帶面做下面這樣的修改就可以獲取資料:

  methods:{
      toArticle:function(index) {
      this.$router.push({name:'article',params:this.blogList[index]});
    }
  }