vue3 trigger
时间: 2023-02-08 19:58:08 浏览: 90
Vue 3 中的 trigger 函数是用来触发一个自定义事件的。它可以在一个 Vue 组件内部使用,也可以在组件外部使用。
使用方式:
```
this.$emit('customEventName', eventData)
```
或者:
```
this.$trigger('customEventName', eventData)
```
其中,'customEventName' 是自定义事件的名称,eventData 是要传递给事件处理函数的数据。
示例:
```
<template>
<div>
<button @click="handleClick">触发事件</button>
</div>
</template>
<script>
export default {
methods: {
handleClick() {
this.$emit('customEvent', 'event data')
}
}
}
</script>
```
在组件外部,你可以使用 $on 来监听这个自定义事件:
```
<template>
<my-component @customEvent="handleEvent"></my-component>
</template>
<script>
import MyComponent from './MyComponent.vue'
export default {
components: {
MyComponent
},
methods: {
handleEvent(eventData) {
console.log(eventData)
}
}
}
</script>
```
在这个例子中,点击组件内的按钮时会触发 customEvent 事件,并在组件外部执行 handleEvent 函数。