vue之父子组件通信

vue之父子组件通信

1、注册子组件

<script>
import adduser from "../add/adduser";
	export default {
	  components: {
	    adduser,
	  },
</script>

2、插入子组件的位置，并进行相应传参（closepop不需要携带参数）

 <!-- 添加用户对话框 -->
      <adduser :addSignal="addSignal" @closepop="closepop"></adduser>

addSingal是传入子组件的信号值，子组件对信号值addSingal进行监听，通过信号值的改变做出相应调整

3、子组件

 props: ["addSignal"], //父组件传值，不需在data中定义可直接使用
 
 this.$emit("closepop", this.addForm); //通知父组件完成操作,并将addForm提交
 
 watch: { //信号值进行监听，当信号值发生改变时触发function
    addSignal: function (newVal, oldVal) {
      //   console.log(newVal, oldVal);
      this.addVisible = true;
    },
  },