<vxe-modal show-close="false" v-model="showEdit" :title="selectRow ? '工时报表导出' : 'Project'" width="800" min-width="400" min-height="300" :loading="submitLoading"> show-close="false" 不管用
时间: 2023-07-12 14:39:48 浏览: 293
如果在 `vxe-modal` 中设置 `show-close="false"` 后关闭按钮仍然存在,可能是以下原因:
1. 首先,需要确认您使用的是最新版本的 `vxe-table` 和 `vxe-table-plugin-element`。您可以通过以下命令检查和更新:
```bash
npm ls vxe-table vxe-table-plugin-element
```
如果版本不是最新的,可以通过以下命令更新:
```bash
npm update vxe-table vxe-table-plugin-element
```
2. 您需要确保在设置 `show-close` 属性之前,已经正确引入了 `vxe-table-plugin-element` 插件。例如:
```js
import Vue from 'vue'
import VXETable from 'vxe-table'
import 'vxe-table/lib/style.css'
import VXETablePluginElement from 'vxe-table-plugin-element'
import 'vxe-table-plugin-element/dist/style.css'
Vue.use(VXETable)
VXETable.use(VXETablePluginElement)
```
3. 如果前两个步骤都没有解决问题,您可以尝试使用样式来覆盖关闭按钮的显示。例如:
```css
.vxe-modal--header .vxe-modal--close-btn {
display: none;
}
```
在这个样式中,我们使用 `display: none` 来隐藏关闭按钮。需要注意的是,这种方法只是通过样式将关闭按钮隐藏起来,而不是真正地删除它。如果您需要彻底删除关闭按钮,可以使用前面介绍的方法,即设置 `show-close="false"`。还需要注意的是,如果您使用了自定义的 close slot,可能需要使用 `v-slot:close` 来代替 `show-close` 属性。例如:
```html
<vxe-modal v-model="visible" width="600" height="400">
<template v-slot:title>弹窗标题</template>
<template v-slot:close>
<!-- 自定义 close slot -->
</template>
<div>弹窗内容</div>
</vxe-modal>
```
阅读全文