vue3 Fragments和emits选项

Vue3中组件可以拥有多根

我们知道,在vue2.x中,每个组件只能有一个根,这意味着我们写每个组件模板时都要套一个父元素。vue3为了更方便的书写组件模板,引入Fragments,说白了就是vue3中组件可以拥有多个根了
例如:创建一个Fragments.vue,组件模板可以写多个根


如上,由以前的单根变成多根的情况,是不是有点零零碎碎的感觉,这就是Fragmens意思的来源—-碎片

vue3针对自定义事件,添加了emits选项

vue3新增emits选项,需要将组件发送的自定义事件定义在emits选项中。一来可以避免当自定义事件与原生事件重名时,事件会触发多次的情况,比如:click事件;二来可以更好的指示组件的工作方式
例如:创建一个Emits.vue,我们自定义了一个click事件



如果自定义事件没有写入到emits选项中,当自定义事件名与原生事件名冲突时,事件会被多次触发




因此,在vue3书写自定义事件的时候,都建议将自定义事件书写到emits选项中

以上就是vue3 Fragmentsemits选项的简单使用

You may also like...