在一些專案需求中需要父元件向子元件動態傳值，例如我這裡的需求是，父元件動態透過axios取得傳回的圖片url數組然後傳給子元件，上傳圖片的子元件拿到該數組後進行遍歷並展示圖片。本文主要介紹了vue父元件動態傳值給子元件的兩種方法 ,需要的朋友可以參考下，希望能幫助大家。
方法有兩種，
方法一：
props傳值，這裡注意一個問題，傳過來的值需要用watch監聽並賦值，否則這裡取得到的是空數組
父元件：
<uploadImg :width="200" :height="200" name="productImage" size="750px*750px" ref="productImage" :src-list="this.productImage"></uploadImg>
this.productImage=res.data.cover;
這裡把透過後台回傳的陣列賦值給
this.productImage，然後把該陣列傳給子元件定義的props屬性src-list
子元件：
watch:{
srcList(curVal,oldVal){
if(curVal){
;
this.uploadImg=curVal;
}
},
}然後子元件成功取得到該陣列
方法二：
透過ref屬性，父元件調用子元件的方法，把要傳的陣列當作參數傳給子元件，子元件取得該參數，並使用
父元件：
this.$refs.productImage.getSrcList(res.data.cover);
子元件：
getSrcList(val){
this.uploadImg=val;
}PS：下面看下vuejs動態元件給子元件傳遞資料
透過子元件定義時候的props可以支援父元件給子元件傳遞數據，這些定義的props在子元件的標籤中使用綁定屬性即可，但如果使用的是
<p class="app" id="deviceready"> <component :is="currentView" :user_name.sync="user_name" :DOB.sync="DOB"></component> </p>
元件的作用於是獨立的
元件的作用於是獨立的，如果要從跟元件取得數據，那麼需要一層層的傳遞才行，也就是說子元件只能從直接父元件取得數據，如果是根元件的數據，那麼父元件就要繼續暴露pops從而綁定來自根元件的數據。
相關推薦：
#以上是兩種vue父元件向子元件動態傳值的方法分享的詳細內容。更多資訊請關注PHP中文網其他相關文章！
