vue-router2.0組件之間傳參及獲取動態(tài)參數(shù)的方法

1.標(biāo)簽

創(chuàng)新互聯(lián)主營定西網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,重慶APP開發(fā),定西h5小程序開發(fā)搭建,定西網(wǎng)站營銷推廣歡迎定西等地區(qū)企業(yè)咨詢

<li v-for=" el in hotLins" >
  <router-link :to="{path:'details',query: {id:el.tog_line_id}}">
    <img :src="el.image_list[0]">
    <h4>{{el.tourism_name}} {{el.tog_line_id}}</h4>
    <p>{{el.address}}</p>
  </router-link>
</li>

2.在組件中，需要傳動態(tài)參數(shù)時，可以如上例子

<router-link :to="{path:'details',query: {id:el.tog_line_id}}">

3.query中的參數(shù)id就是要傳的參數(shù)，在組件中獲取的方法為：

created: function() {
  var id = this.$route.query.id;
  this.getData(id);
 },

4.如上述，this.$route.query.id就可以獲取該參數(shù)，也可以通過，this.$root.id = id;傳給父組件，父組件中通過

　// 根組件構(gòu)造器
  var vm = Vue.extend({
   router: router,
   data: function() {
    return {
     id: '11484' //城會玩明細(xì)id
    }
   }
  });

5.定義data中的id，然后子組件中用props傳遞參數(shù)

props: {
    id: {
     type: String,
     required: true
    }
   },

6.router-view中，傳遞該參數(shù)：

<router-view :id="id" :order-info="orderInfo">
</router-view>

注意orderInfo時，在這邊用的是:order-info。

以上這篇vue-router2.0 組件之間傳參及獲取動態(tài)參數(shù)的方法就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持創(chuàng)新互聯(lián)。

標(biāo)題名稱：vue-router2.0組件之間傳參及獲取動態(tài)參數(shù)的方法
分享鏈接：http://www.muchs.cn/article34/gehese.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供自適應(yīng)網(wǎng)站、品牌網(wǎng)站制作、建站公司、網(wǎng)站改版、關(guān)鍵詞優(yōu)化、標(biāo)簽優(yōu)化

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)

商城網(wǎng)站建設(shè)