埋め込み穴1:vue中性子コンポーネント呼び出し兄弟コンポーネントメソッド
1821 ワード
小計:開発中にサブコンポーネントに遭遇した場合、兄弟コンポーネントを呼び出す方法が必要です.以下に小さなdemoを書いて心得を記録します.もし良い方法があれば、コメントエリアで教えてください.
親コンポーネントサンプルコード:
サブアセンブリ1
サブアセンブリ2:
親コンポーネントサンプルコード:
:
$emit , $ref , click
//
import son1 from './son1'
//
import son2 from './son2'
export default {
data() {
return {
dataFromFather: []
}
},
//
components: {
son1,
son2
},
methods: {
// 2 click
triggerBrotherMethods() {
// $ref 1
this.$refs.borther[0].bortherMethods()
},
}
}
サブアセンブリ1
:
,
{{dataFromFather}}
export default {
data() {
return {
}
},
props: ['dataFromFather'],
methods: {
//
bortherMethods() {
//
...
},
}
}
サブアセンブリ2:
:
, click emit
{{dataFromFather}}
export default {
data() {
return {
}
},
props: ['dataFromFather'],
methods: {
//
triggerBrotherMethods() {
this.$emit('clickBrotherBtn', true)
},
}
}