这里测试了一个父组件接受子组件的实例
App.vue
import componentA from './components/componentA'
listenToMyBoy:function (msg) {
this.childworlds=msg
}
<p>boy tell me:{{childworlds}}</p>
<component-a msgformfather='you die!' v-on:child-tell-me-sth='listenToMyBoy'></component-a>
componentA.vue
<script>
export default {
data: function () {
return {
msg: 'hello from componentA',
}
},
props:['msgformfather'],
methods: {
clickme:function () {
// console.log(this.msgformfather)
this.$emit('child-tell-me-sth',this.msg)
// this.$dispatch('child-tell-me-sth',this.msg)
}
}
}
</script>
<style>
</style>
childworlds: '' 需要在data属性里面设置,切记
这里使用到的是$emit,然后通过v-on的绑定事件进行监听
已经废弃$dispatch,这边是官方具体文档说明,自己没有试过,/狗头保命
https://cn.vuejs.org/v2/guide/migration.html#dispatch-%E5%92%8C-broadcast-%E6%9B%BF%E6%8D%A2