vue工作开发总结（四）----事件参数$event

置顶随风小薇

于 2020-06-02 13:10:09 发布

阅读量1k

点赞数 1

分类专栏： vue 文章标签： vue event

本文为博主原创文章，未经博主允许不得转载

本文链接：https://blog.youkuaiyun.com/qq_39197547/article/details/106494145

版权

vue 专栏收录该内容

34 篇文章 ¥299.90 ¥399.90

订阅专栏

本文总结了Vue框架中$event的使用，它在原生事件和自定义事件中扮演重要角色，允许传递额外参数。通过$event，可以方便地在子组件间通信。查阅官方文档了解更多详情。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

$event 是事件对象的特殊变量，在一些场景可以帮我们实现提供更多可用参数

###原生事件

在原生事件中表现和默认事件对象相同


<template>
    <div>
        <input type="text" @input-"inputhandler('hello',$event)" />
    </div>
</template>
export default {
    methods:{
        inputhandler(msg,e){
            console.log(e.target.value)
        }
    }
}

自定义事件

在自定义事件中表现为捕获从子组件抛出的值

my-vue.vue:

export default {
    methods:{
        customEvent(){
            this.emit('custom-event',{name:"wangwei"})
        }
    }
}

app.vue:
<template>
    <div>
        <my-vue v-for="(item,index) in list" @custom-event="customEve

了解本专栏