emit的用法
来源：3-18 Teleport - 瞬间移动 第二部分
Hania冲鸭
2023-01-02
老师你好，关于emit的用法逻辑我还是不太理解
context.emit向父组件抛出事件：
setup(props, context) {
const buttonClick = () => {
context.emit('close-modal')
}
return { buttonClick }
}
})
那么父组件里为什么这么写：
<modal :isOpen="modalIsOpen" @close-modal="onModalClose">My Modal!!!</modal>
这其中的逻辑是什么？
点击子组件中的按钮，触发buttonClick事件，然后向父组件抛出close-modal事件？在父组件中，onModalClose事件就相当于close-modal？
我有些混乱，麻烦老师解答下
写回答
1回答
-
张轩
2023-01-03
同学你好
事件对于一个组件是有重要的东西，因为有了事件父组件就可以特定的时刻完成特定的操作。
回到这段代码：
<modal :isOpen="modalIsOpen" @close-modal="onModalClose">My Modal!!!</modal> @close-modal 是事件名称，和 context.emit('close-modal') 这个是一致的。 onModalClose 是事件的回调，是父组件中定义的一个函数。这个函数执行的时候事件被触发。322023-01-04
相似问题