Vue3 Emit自定义事件代码模板

最新推荐文章于 2024-08-30 19:58:42 发布

ChuanYang Chen

最新推荐文章于 2024-08-30 19:58:42 发布

阅读量352

点赞数

分类专栏：前端 Vue javascript 文章标签：前端 javascript vue.js

本文链接：https://blog.csdn.net/weixin_45525653/article/details/125551407

版权

前端同时被 3 个专栏收录

73 篇文章 1 订阅

订阅专栏

javascript

39 篇文章 0 订阅

订阅专栏

Vue

29 篇文章 0 订阅

订阅专栏

App.vue 中

<template>
  <Emit @myEmit="showMessage"></Emit>
</template>

<script>
import Emit from './components/Emit.vue'
export default {
  name: "App",
  components: {Emit},
  setup() {
    function showMessage(msg){
      alert(msg)
    }
    return {showMessage};
  },
};
</script>

Emit 组件中

<template>
  <div @click="$emit('myEmit','这是一条触发Emit组件后传递的消息')">绑定自定义事件的组件</div>
</template>
<script>

export default {
  emits:['myEmit'],
  setup() {
    return {
      
    };
  },
};
</script>