瀏覽代碼

feat: 表格选择器添加默认回显

xiaoxian521 1 年之前
父節點
當前提交
0b9fcaca4a
共有 1 個文件被更改,包括 17 次插入2 次删除
  1. 17 2
      src/views/pure-table/high/table-select/multiple/columns.tsx

+ 17 - 2
src/views/pure-table/high/table-select/multiple/columns.tsx

@@ -1,13 +1,13 @@
 import { message } from "@/utils/message";
 import { tableDataEdit } from "../../data";
-import { type Ref, ref, reactive } from "vue";
 import type { PaginationProps } from "@pureadmin/table";
 import { cloneDeep, isAllEmpty } from "@pureadmin/utils";
+import { type Ref, ref, reactive, watch, nextTick } from "vue";
 
 export function useColumns(selectRef: Ref, formRef: Ref, tableRef: Ref) {
   const tableData = ref(tableDataEdit);
   const cloneTableData = cloneDeep(tableData.value);
-  const selectValue = ref([]);
+  const selectValue = ref([1, 3, 4]);
   const searchForm = reactive({
     sexValue: "",
     searchDate: ""
@@ -110,6 +110,21 @@ export function useColumns(selectRef: Ref, formRef: Ref, tableRef: Ref) {
     });
   };
 
+  watch(
+    selectValue,
+    async () => {
+      await nextTick();
+      const { toggleRowSelection } = tableRef.value.getTableRef();
+      selectValue.value.forEach(val => {
+        tableData.value.forEach(row => {
+          // 默认回显
+          row.id === val ? toggleRowSelection(row) : undefined;
+        });
+      });
+    },
+    { immediate: true }
+  );
+
   return {
     searchForm,
     sexOptions,