可以自定义事件让子组件向父组件传值
1.使用emit
2.使用props
3.使用mitt
其实mitt和第一种方法类似,都用emitt事件,但是mitt不局限于父子之间通信,他可以在任意2个组件之间通信,
虽然需要安装,但mitt
很小,几乎不影响组件正常运行速度
安装mitt
npm i mitt
然后在src目录下新建utils文件夹(utils用来存放工具),在新建一个emitter.js文件,如图emitter.js写入以下代码
以上代码通过mitt()
创建实例,.on
用来绑定事件,.emit
用来触发事件,.off
用来解绑事件,也可以用.all.clear
解绑全部事件
然后在main.js中引入就可以使用了
import emitter from "@/utils/emitter";
运行效果如下:
接下来是组件通信的写法,假设父组件里有v1,v2两个组件
如上可实现组件通信,建议在组件销毁时解绑