fix: 树形展开关闭功能 bug

xingyu
1 parent c98965cd
Showing 2 changed files with 10 additions and 11 deletions
yudao-ui-admin-vue3/src/views/system/dept/index.vue
yudao-ui-admin-vue3/src/views/system/menu/index.vue
 <template>
   <ContentWrap>
     <!-- 列表 -->
-    <XTable @register="registerTable" show-overflow>
+    <XTable ref="xGrid" @register="registerTable" show-overflow>
       <template #toolbar_buttons>
         <!-- 操作：新增 -->
         <XButton
@@ -11,8 +11,8 @@
           v-hasPermi="['system:dept:create']"
           @click="handleCreate()"
         />
-        <XButton title="展开所有" @click="xGrid?.setAllTreeExpand(true)" />
-        <XButton title="关闭所有" @click="xGrid?.clearTreeExpand()" />
+        <XButton title="展开所有" @click="xGrid?.Ref.setAllTreeExpand(true)" />
+        <XButton title="关闭所有" @click="xGrid?.Ref.clearTreeExpand()" />
       </template>
       <template #leaderUserId_default="{ row }">
         <span>{{ userNicknameFormat(row) }}</span>
@@ -77,7 +77,6 @@
 <script setup lang="ts" name="Dept">
 import { nextTick, onMounted, ref, unref } from 'vue'
 import { ElSelect, ElTreeSelect, ElOption } from 'element-plus'
-import { VxeGridInstance } from 'vxe-table'
 import { handleTree, defaultProps } from '@/utils/tree'
 import { useI18n } from '@/hooks/web/useI18n'
 import { useMessage } from '@/hooks/web/useMessage'
@@ -90,7 +89,7 @@ import { getListSimpleUsersApi, UserVO } from &#39;@/api/system/user&#39;
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 // 列表相关的变量
-const xGrid = ref<VxeGridInstance>() // 列表 Grid Ref
+const xGrid = ref<any>() // 列表 Grid Ref
 const treeConfig = {
   transform: true,
   rowField: 'id',
 <template>
   <ContentWrap>
     <!-- 列表 -->
-    <XTable @register="registerTable" show-overflow>
+    <XTable ref="xGrid" @register="registerTable" show-overflow>
       <template #toolbar_buttons>
         <!-- 操作：新增 -->
         <XButton
@@ -11,8 +11,8 @@
           v-hasPermi="['system:menu:create']"
           @click="handleCreate()"
         />
-        <XButton title="展开所有" @click="xGrid?.setAllTreeExpand(true)" />
-        <XButton title="关闭所有" @click="xGrid?.clearTreeExpand()" />
+        <XButton title="展开所有" @click="xGrid?.Ref.setAllTreeExpand(true)" />
+        <XButton title="关闭所有" @click="xGrid?.Ref.clearTreeExpand()" />
       </template>
       <template #name_default="{ row }">
         <Icon :icon="row.icon" />
@@ -194,7 +194,6 @@ import {
 } from 'element-plus'
 import { Tooltip } from '@/components/Tooltip'
 import { IconSelect } from '@/components/Icon'
-import { VxeGridInstance } from 'vxe-table'
 // 业务相关的 import
 import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
 import { SystemMenuTypeEnum, CommonStatusEnum } from '@/utils/constants'
@@ -206,9 +205,10 @@ import { useXTable } from &#39;@/hooks/web/useXTable&#39;
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 const { wsCache } = useCache()
+
+const xGrid = ref<any>(null)
+
 // 列表相关的变量
-// 列表相关的变量
-const xGrid = ref<VxeGridInstance>() // 列表 Grid Ref
 const treeConfig = {
   transform: true,
   rowField: 'id',