实现子组件向父组件传递点击事件 / 传值

实现子组件向父组件传递点击事件 / 传值

子组件向父组件传值使用的是emit方法，详细的组件间传值方法可以参照vue的官方文档~

在本项目中，子组件为Right，父组件为Experiment，如下图所示：

1、先给子组件绑定一个点击事件，这个点击事件负责监听子组件的状态

2、在ts中给这个点击事件构造函数，函数里面定义一个事件名，这个事件名将负责向父组件传递子组件状态

3、在父组件引入子组件，成立父子关系（本项目是使用vue2.0+vue-cli3+ts，不同版本和脚本语法在引入组件方面略有不同，读者可以根据自身情况进行页面引入）

4、给父组件对应标签绑定点击事件

5、给父组件绑定的事件构造方法

此时已经完成子组件向父组件传递点击事件 / 传值的过程，如果构造完方法可以执行则证明传参成功，如果没有效果，则可以尝试使用断点的方式判断错误，如在子组件的函数下alert一个弹窗。由下至上层层寻找错误节点~

6、本项目是希望子组件点击其模块，父组件标签栏新增标签

过程思想为：给子组件绑定一个点击事件，监听这个点击事件，当点击事件被触发时通过一个传递点击事件的方式传递给父组件，父组件收到点击事件之后执行相应方法，成功页面如下图