子组件改变父组件的变量 (记录)

⛳️： 子组件改变父组件的变量 (记录)

---

😇： 鑫动了的主页 – 欢迎各位小伙伴

---

💗： 前端小白的成长之路，一起学习，一起成长~

1.平常在子组件中如果操作父组件变量，惯例是在子组件emit一个事件，然后在父组件的处理方法中去修改该值，但是这样写太麻烦了，因此，我们使用了.sync修饰符，然后约定子组件使用$emit(‘update:某变量’，传入的变量)，让父组不用写处理方法就可以修改num变量

以下为代码简写 :

父组件

<A  :num.sync = "num" ></A>
<p> 此处加1了: {{num}} </p>
data(){
	return:{
		num:0,
	}
}
</font>

子组件

<div @click="btn()">点我+1</div>
methods：{
	btn(){
		num++;
		this.emit("update:num",num)  //固定方法 
	}
}