創(chuàng)新互聯(lián)公司專業(yè)為企業(yè)提供張掖網(wǎng)站建設(shè)、張掖做網(wǎng)站、張掖網(wǎng)站設(shè)計(jì)、張掖網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁(yè)設(shè)計(jì)與制作、張掖企業(yè)網(wǎng)站模板建站服務(wù)，10余年張掖做網(wǎng)站經(jīng)驗(yàn)，不只是建網(wǎng)站，更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。

在使用VUE開發(fā)的時(shí)候，有時(shí)候，我們需要通過父組件像子組件傳遞數(shù)據(jù)或者為了防止每個(gè)子組件都會(huì)有請(qǐng)求數(shù)據(jù)事件的發(fā)生，從而導(dǎo)致代碼冗余，所以，我們可以把同一個(gè)模塊下的所有子組件請(qǐng)求事件都放到父組件中去處理。

1、父組件通過屬性的方式給子組件傳值

//注意：":city"和":swiperList"這里定義的什么名字，子組件中props接收的就是什么名字

//? ? ?"city"和"swiper"是你data中定義的名字

//js中

//data中定義好參數(shù)名，methods中獲取數(shù)據(jù)并賦值給data中的參數(shù)? ?

data(){

return{

city:'',

swiper:[]

}

},

methods:{

getHomeInfo (){

axios.get('/api/index.json')

.then(this.getHomeInfoSuccess)

},

getHomeInfoSuccess(res){

//這里面的數(shù)據(jù)獲取結(jié)構(gòu)取決于你自己的接口返回來的結(jié)構(gòu)

res = res.data

if(res.ret && res.data){

const data = res.data

this.city = data.city

this.swiper = data.swiperList

}

}

},

2、子組件使用props接收父組件傳遞的屬性

子組件props中接收的參數(shù)只需要給其定義好數(shù)據(jù)類型即可！

Header子組件中：

//js中

props:{

city:String

}

Swiper子組件中：

//js中

props:{

swiperList: Array

}

另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)cdcxhl.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時(shí)售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國(guó)服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡(jiǎn)單易用、服務(wù)可用性高、性價(jià)比高”等特點(diǎn)與優(yōu)勢(shì)，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場(chǎng)景需求。

分享題目：VUE父組件向子組件傳遞數(shù)據(jù)-創(chuàng)新互聯(lián)
當(dāng)前地址：http://weahome.cn/article/dedesd.html