
child.vue
<template>
<div>
<el-button type="primary" @click.stop="$emit(`get`, data)">点击传参</el-button>
</div>
</template>
<script>
export default { name: "child", props: ["data"] };
</script>
demo
<template>
<child ref="child" :data="{}" />
</template>
<script>
import child from "@/vue/admin/demo/child";
export default {
components: {
child,
},
mounted() {
this.$refs.child.$props.data.msg = `异步传输属性内容给子组件child`; //注意修改的数据一定要是对象类型,否则会报错Avoid mutating
this.$refs.child.$on(`get`, this.get);
},
beforeDestroy() {
this.$refs.child.$off(`get`, this.get);//记得要销毁哟,否则会很卡的!
},
methods: {
get(d) {
console.log(``, d.msg);
},
},
};
</script>