好资源导航 » 文章资讯 » 从Node.js事件触发器到Vue自定义事件的深入讲解

从Node.js事件触发器到Vue自定义事件的深入讲解

2023-07-22 11:50:13 85

Node.js中的事件触发器所引发的思考

今天在看Node.js文档的时候讲到事件触发器，其中的emit方法让我想到了Vue中的自定义事件，借此我对Vue又有了新的理解，所以将我的理解记录下来，留作学习笔记。

Node.js中的事件触发器

Node.js为我们提供了一个事件模块：EventEmitter，我们可以用它来处理事件

constEventEmitter=require('events')
consteventEmitter=newEventEmitter()

eventEmitter对象上有两个方法：on和emit

on用于添加自定义事件，注册回调函数
emit用于触发事件，并将参数传递给回调函数

eventEmitter.on('start',(e)=>{
console.log(e)
})
eventEmitter.emit('start','started')

控制台将会打印started

Vue中的自定义事件

给组件添加自定义事件，下面示例代码中的enlarge-text事件就是我们自己定义的事件，onEnlargeText则是事件触发时所要执行的回调函数，这里的onEnlargeText是一个函数指针，指向methods中所定义的onEnlargeText函数。既然是回调函数，所以可能会有参数传给它，那么自定义事件的回调函数中的参数是谁传递给它的，具体含义又是什么呢？




methods:{
onEnlargeText:function(enlargeAmount){
this.postFontSize+=enlargeAmount
}
}

子组件事件处理中可以通过内建的「$emit」方法传入父组件自定义事件名来触发这个自定义事件，并且通过「$emit」的第二个参数将需要传递给父组件的数据抛出，这样，自定义事件的回调函数中的参数来源也就明白了，就是「$emit」方法的第二个参数，这里可以直接抛出一个更加灵活的对象。


Enlargetext

到这里我们可以看到，Vue中的自定义事件和Node.js中的事件触发器的理念非常相似，Vue中自定义事件的注册是在父组件中完成的，而触发是在子组件中完成的。至此，就完成了对Vue自定义事件的解释。

参考资源

nodejs.cn/learn/the-n…

cn.vuejs.org/v2/guide/co…

总结

到此这篇关于从Node.js事件触发器到Vue自定义事件的文章就介绍到这了,更多相关Node.js事件触发器到Vue自定义事件内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！

返回顶部
514930285
czq8825@qq.com

从Node.js事件触发器到Vue自定义事件的深入讲解

热门推荐

随机推荐