我正在尋找一種將資料從父組件傳遞到子組件的子組件的方法。我知道我可以使用道具來做到這一點，就像在這個執行緒Vue JS Pass Data From Parent To Child Of Child Of Child
但是我只讓它為“下一個”子組件作業，而我被第二個子組件卡住了。
我的父組件：
<ResultBar :carbondata="realCarbonValues" />
data() {
return {
realCarbonValues: {
slabs: 20,
beams: 0,
columns: 0,
foundation: 0,
core: 0
}
};
我的子組件：
props: {
carbondata:Object
},
console.log(this.carbondata.slabs)
現在，我可以使用子組件在控制臺中記錄資料
但是我必須在下一個子組件中做什么才能正確傳遞資料？
uj5u.com熱心網友回復：
根據您要執行的操作，您可以再次將其作為道具直接傳遞。
家長：
<Child :prop-i-wanna-pass-deeply="something" />
孩子：
<GrandChild :props-i-wanna-pass-deeply-again="propsIWannaPassDeeply" />
孫子：
<div>{{ propsIWannaPassDeeplyAgain }} is now here</div>
或者只是使用provideandinject來避免螺旋鉆。
見：https ://vuejs.org/v2/api/#provide-inject
閱讀有關提供/注入反應性的說明。
家長：
<Child /> <!-- no need to pass the prop -->
provide() {
return {
something: "fooAbc",
}
}
孩子：
<GrandChild />
孫子：
<div>{{ something }}</div>
inject: ['something']
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/414928.html
標籤：