vue親子コンポーネントは値を伝達し、サブコンポーネントはprops値を取得できない
1473 ワード
質問:親コンポーネントpropsはサブコンポーネントに値を渡し、サブコンポーネントはcreatedで渡された値を取得できません.
props伝値については、ここでは説明せずに公式サイトをご覧ください.https://cn.vuejs.org/v2/guide/components-props.html
分析:親コンポーネントpropsがサブコンポーネントに渡す値はバックエンドインタフェースで返されるデータ、すなわち非同期で返されるデータなので、問題が発生しました.バックエンドがいつ完了を要求し、付与を完了するかどうやって知っていますか.したがって、値が同期しないため、もちろん取得できません.
ソリューション:1.settimeoutで遅延したり、非同期リクエストデータが完了したりして、付与(推奨しない)方法を書くことができます.
2.watchでpropsの変化を傍受し、戻り値があれば直接値を付与し、具体的には以下のように実現する.
props伝値については、ここでは説明せずに公式サイトをご覧ください.https://cn.vuejs.org/v2/guide/components-props.html
分析:親コンポーネントpropsがサブコンポーネントに渡す値はバックエンドインタフェースで返されるデータ、すなわち非同期で返されるデータなので、問題が発生しました.バックエンドがいつ完了を要求し、付与を完了するかどうやって知っていますか.したがって、値が同期しないため、もちろん取得できません.
ソリューション:1.settimeoutで遅延したり、非同期リクエストデータが完了したりして、付与(推奨しない)方法を書くことができます.
getAsyncDataBySetTimeout() {
setTimeout(() => {
this.queryDataByAsync() //
},2000) // 2
}
2.watchでpropsの変化を傍受し、戻り値があれば直接値を付与し、具体的には以下のように実現する.
editTableList: function(newVal, oldVal) => {
// tableList
this.tableList = newVal
// vue editTableList , , newVal , props
//
newVal && this.queryAsyncDataByNewval()
}
//
editTableList: {
handler (newVal, oldVal) {
// tableList
this.tableList = newVal
// vue editTableList , , newVal , props
//
newVal && this.queryAsyncDataByNewval()
},
// immediate true wacth , handler
// , created
immediate: true,
deep: true //
}
: , ( ),
props, ,
,
, ,
, 。