<template> <div> <div class="dialog-mask" @click="$emit('close-dialog')" v-show="dialogVisible"></div> <div class="dialog" v-show="dialogVisible">,如何用emit方式关闭资金
时间: 2023-07-03 14:27:33 浏览: 108
ShowDialog()的超简单的关闭用法
4星 · 用户满意度95%
同样的,你可以在 `div.dialog-mask` 上绑定 `@click` 事件,然后在事件处理程序中调用 `$emit('close-funds')` 来关闭资金。具体代码实现如下:
```
<template>
<div>
<div class="dialog-mask" @click="$emit('close-funds')" v-show="dialogVisible"></div>
<div class="dialog" v-show="dialogVisible">
<div class="dialog-content">
<div class="dialog-title">资金</div>
<div class="dialog-body">
<div id="funds-container" class="textarea">
<!-- 对话框内容 -->
</div>
</div>
</div>
</div>
</div>
</template>
```
在这个例子中,我们在对话框外层包裹了一个 `<div>` 元素,并在这个元素上绑定了 `@click` 事件。当用户点击对话框外部时,事件处理程序将调用 `$emit('close-funds')` 来触发父组件的 `close-funds` 事件,从而关闭资金对话框。注意,这里的事件名称需要与父组件中相应的事件名称保持一致。
阅读全文