by2025/admin-vben5
9
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

chore: 临时解决方案 for 弹窗组件内部表格

Browse Source
This commit is contained in:
dap 2024-10-30 09:47:07 +08:00
parent 0a99b4049d
commit bae08aa6c5
2 changed files with 36 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
apps/web-antd/src/views/system/role-assign/index.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { ref } from 'vue';
import { nextTick, ref } from 'vue';
import { useRoute } from 'vue-router';
import { Page, useVbenDrawer, type VbenFormProps } from '@vben/common-ui';
@ -79,8 +79,24 @@ const [BasicTable, tableApi] = useVbenVxeGrid({
},
});
const init = ref(true);
const [RoleAssignDrawer, drawerApi] = useVbenDrawer({
connectedComponent: roleAssignDrawer,
/**
* TODO: 等待官方修复
* 临时解决方案 for https://github.com/vbenjs/vue-vben-admin/issues/4752
* 通过在关闭时使用v-if切换来造成Modal的重新渲染
* 目前Modal逻辑为每次打开 内部的元素会重新mount 但是Modal本身不会重新渲染
* 该方案会造成关闭动画丢失(应该放在afterClose中)
* @param isOpen 是否打开
*/
onOpenChange: async (isOpen) => {
if (!isOpen) {
init.value = false;
await nextTick();
init.value = true;
}
},
});
function handleAdd() {
@ -156,6 +172,6 @@ function handleMultipleAuthCancel() {
</Popconfirm>
</template>
</BasicTable>
<RoleAssignDrawer @reload="tableApi.query()" />
<RoleAssignDrawer v-if="init" @reload="tableApi.query()" />
</Page>
</template>

20
apps/web-antd/src/views/tool/gen/index.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts">
import type { Recordable } from '@vben/types';
import { onMounted, ref } from 'vue';
import { nextTick, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import { Page, useVbenModal, type VbenFormProps } from '@vben/common-ui';
@ -188,8 +188,24 @@ function handleMultiDelete() {
});
}
const init = ref(true);
const [TableImportModal, tableImportModalApi] = useVbenModal({
connectedComponent: tableImportModal,
/**
* TODO: 等待官方修复
* 临时解决方案 for https://github.com/vbenjs/vue-vben-admin/issues/4752
* 通过在关闭时使用v-if切换来造成Modal的重新渲染
* 目前Modal逻辑为每次打开 内部的元素会重新mount 但是Modal本身不会重新渲染
* 该方案会造成关闭动画丢失(应该放在afterClose中)
* @param isOpen 是否打开
*/
onOpenChange: async (isOpen) => {
if (!isOpen) {
init.value = false;
await nextTick();
init.value = true;
}
},
});
function handleImport() {
@ -290,6 +306,6 @@ function handleImport() {
</template>
</BasicTable>
<CodePreviewModal />
<TableImportModal @reload="tableApi.query()" />
<TableImportModal v-if="init" @reload="tableApi.query()" />
</Page>
</template>