python自定义事件event的含义_Vue 3 自定义事件

自定义事件

除了系统自带的原生 DOM 自带的事件之外，有时候我们需要用到这些自带的事件之外，我们就必须要自定义事件了。

事件名

不同于组件和 prop，事件名不存在任何自动化的大小写转换。而是触发的事件名需要完全匹配监听这个事件所用的名称。举个例子，如果触发一个 camelCase 名字的事件，我们还是接着昨天的项目继续往下写，在 TestCom.vue 使用 button 按钮点击事件分发一个 click-event 事件，不同于组件和 prop，事件名不会被用作一个 JavaScript 变量名或 property 名，所以就没有理由使用 camelCase 或 PascalCase 了。并且 v-on 事件监听器在 DOM 模板中会被自动转换为全小写 (因为 HTML 是大小写不敏感的)，所以 @myEvent 将会变成 @myevent——导致 myEvent 不可能被监听到。

{ { title }}

按钮

name: "TestCom",

props: {

title: {

type: String,

default: "",

},

},

created() {

console.log(this.$attrs)

},

methods: {

click(e) {

this.$emit('click-event', e)

}

}

};

然后我们在 TemplateM.vue 来接收这个事件：

title="这个是组件"

data-status="active"

@click-event="clickEvent"

>

export default {

name: "TemplateM",

components: {

TestCom,

},

data() {

return {};

},

methods: {

clic