父传子,并且通过fatherEvent接收子组件传过来的值
<template>
<div class='father'>
<Son :fatherData="fatherData" @fatherEvent='getSonMsg' />
</div>
</template>import Son from './Son';
export default{
data(){return{
fatherData:{
msgData:"我是父亲"}
},
components:{
Son
},
methods:{
getSonMsg(msg){
console.log(`这是从子组件传来的msg${msg}`)
}
}子组件接受父组件消息,并通过$emit回传父组件(当然也可以不通过watch)
<template>
<div class='son' >{msg} <button @click='fatherEmit'></button>
</div>
</template>
<script>export default(){
name:"son',
props:{
fatherData:Object
}
data(){
return{
msg:""}
}
},
watch:{
fatherData:function(newValue,oldValue){
this.changeData()
}
},
methods:{
changeData(){
this.$nextTick(function(){
this.msg = this.fatherData.msgData
}
}),
fatherEmit(){
this.$emit('fatherEvent','我是额子')
}
}
</script>點擊查看更多內容
5人點贊
評論
評論
共同學習,寫下你的評論
評論加載中...
作者其他優質文章
正在加載中
感謝您的支持,我會繼續努力的~
掃碼打賞,你說多少就多少
贊賞金額會直接到老師賬戶
支付方式
打開微信掃一掃,即可進行掃碼打賞哦