vue-vben-admin icon indicating copy to clipboard operation
vue-vben-admin copied to clipboard

关于使用Table时searchInfo动态获取的问题

Open yanzj opened this issue 3 years ago • 3 comments

Subject of the feature

关于使用Table使用时searchInfo动态获取的问题。

Problem

目前看searchInfo的值似乎只能在初始化的时候写入。可是有些情况下需要从传入的参数中获取。比如在打开的Dailog中需要用到表格的情况:

const clazzID = ref(0);

const [registerModal, { setModalProps, closeModal }] = useModalInner(async (params) => {
        setModalProps({ confirmLoading: false });
        clazzID.value = params.clazz_id;
        _debugLog(clazzID.value);
        reload();
      });

const [registerTable, { reload }] = useTable({
        title: '',
        immediate: false,
        api: apiList,
        searchInfo: () => {
          return { clazz_id: clazzID.value };
        },
        searchInfo: { clazz_id: clazzID.value },  // 这种情况下其实赋予的是初始值,但我们希望能够赋予Modal参数中的对应值
        columns,
        formConfig: {
          labelWidth: 120,
          schemas: searchFormSchema,
        },
        useSearchForm: true,
        // showTableSetting: false,
        showIndexColumn: true,
        bordered: true,
        ellipsis: false,
        actionColumn: {
          fixed: 'right',
          width: 80,
          title: '操作',
          dataIndex: 'action',
          slots: { customRender: 'action' },
        },
      });

Alternatives

我做了如下改造

       searchInfo: () => {
          return { clazz_id: clazzID.value };
        },

useDataSource.ts

      let currentSearchInfo = searchInfo;
      if (searchInfo && isFunction(searchInfo)) {
        currentSearchInfo = searchInfo();
      }

      let params: Recordable = {
        ...pageParams,
        ...(useSearchForm ? getFieldsValue() : {}),
        // ...searchInfo,
        ...currentSearchInfo,
        ...(opt?.searchInfo ?? {}),
        ...defSort,
        ...sortInfo,
        ...filterInfo,
        ...(opt?.sortInfo ?? {}),
        ...(opt?.filterInfo ?? {}),
      };

这样改造我能考虑到可能的副作用是,如果处理不当,可能对整体的分页会产生影响。

yanzj avatar Nov 25 '21 05:11 yanzj

把 reload 解构出来,利用 reload 动态传入 searchInfo 的值。

reload({
  searchInfo: {
    // name: "xxx"
  }
})

i7eo avatar Nov 25 '21 07:11 i7eo

把 reload 解构出来,利用 reload 动态传入 searchInfo 的值。

reload({
  searchInfo: {
    // name: "xxx"
  }
})

或者使用 fetch-before 事件,进行劫持,修改接口参数

i7eo avatar Nov 25 '21 07:11 i7eo

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

anncwb avatar May 04 '24 01:05 anncwb