组件中emit的声明触发事件

触发与监听事件:在组件的模板表达式中，可以直接使用 $emit 方法触发自定义事件

作用是子组件里面向父级里面去返回,简单来说就是把数据返回给父级

注意:

$emit方法的初步使用:

先在子组件按钮里面定义一个点击事件,然后点击事件后面加上$emit方法,方法里放两个参数,第一个是属性名(没有固定名称要求,可以随便取),第二个参数放你要输出的值(里面不能加双引号,会报错)加单引号可以,也写数字类型

父级则在子组件标签里用@加上子组件$emit里定义的属性名操作函数输出,和@click点击事件没区别,作用是一样的

使用随机数等其他方式也可以输出

$emit深入应用:

给子组件加一个随机数加随机变化颜色功能,先在子组件导入响应状态,使用String类型的substring截取随机数的3到6位,获取到随机颜色的参数,在按钮下面定义一个view,里面加一个背景颜色,父级不用改变即可实现

第二种方式:在父级里面将事件点击后面定义一个函数,然后使用defineEmits属性声明一个要传递的事件名称,函数里采用emit方法,emit里面的第一个参数:事件名称依然是defineEmits属性声明的常量名,第二个参数就是要输出的值,比如随机数,效果是一样的

也可以不传值,只不过不显示罢了,但一般情况下都要传值

在父级也可以定义多个函数,比如我这次加一个输入框,和之前的方法类似,子组件加<input>
标签,并在defineEmits方法里多声明一个事件名称,然后同样在emit方法调用并打印值,父级这边可以加一个文字大小方法属性在背景颜色和input函数里面打印输出即可