fix(table): table columns setting error

This commit is contained in:
vben 2021-01-02 10:28:44 +08:00
parent aa596af608
commit af55511bd6
3 changed files with 32 additions and 12 deletions

View File

@ -4,6 +4,10 @@
- 新增`mixSideTrigger`配置。用于配置左侧混合模式菜单打开方式。可选`hover`,默认`click` - 新增`mixSideTrigger`配置。用于配置左侧混合模式菜单打开方式。可选`hover`,默认`click`
### 🐛 Bug Fixes
- 修复表格列配置已知问题
## 2.0.0-rc.15 (2020-12-31) ## 2.0.0-rc.15 (2020-12-31)
### ✨ 表格破坏性更新 ### ✨ 表格破坏性更新

View File

@ -1,6 +1,6 @@
import type { BasicColumn, BasicTableProps, CellFormat, GetColumnsParams } from '../types/table'; import type { BasicColumn, BasicTableProps, CellFormat, GetColumnsParams } from '../types/table';
import type { PaginationProps } from '../types/pagination'; import type { PaginationProps } from '../types/pagination';
import { unref, ComputedRef, Ref, computed, watchEffect, ref, toRaw } from 'vue'; import { unref, ComputedRef, Ref, computed, watch, ref, toRaw } from 'vue';
import { isBoolean, isArray, isString, isObject } from '/@/utils/is'; import { isBoolean, isArray, isString, isObject } from '/@/utils/is';
import { DEFAULT_ALIGN, PAGE_SIZE, INDEX_COLUMN_FLAG, ACTION_COLUMN_FLAG } from '../const'; import { DEFAULT_ALIGN, PAGE_SIZE, INDEX_COLUMN_FLAG, ACTION_COLUMN_FLAG } from '../const';
import { useI18n } from '/@/hooks/web/useI18n'; import { useI18n } from '/@/hooks/web/useI18n';
@ -156,11 +156,22 @@ export function useColumns(
return viewColumns; return viewColumns;
}); });
watchEffect(() => { watch(
const columns = toRaw(unref(propsRef).columns); () => unref(propsRef).columns,
columnsRef.value = columns; (columns) => {
cacheColumns = columns?.filter((item) => !item.flag) ?? []; columnsRef.value = columns;
}); cacheColumns = columns?.filter((item) => !item.flag) ?? [];
}
);
// watchEffect(() => {
// const columns = toRaw(unref(propsRef).columns);
// console.log('======================');
// console.log(111);
// console.log('======================');
// columnsRef.value = columns;
// cacheColumns = columns?.filter((item) => !item.flag) ?? [];
// });
/** /**
* set columns * set columns

View File

@ -3,11 +3,10 @@ import type { PaginationProps } from '../types/pagination';
import type { DynamicProps } from '/@/types/utils'; import type { DynamicProps } from '/@/types/utils';
import { getDynamicProps } from '/@/utils'; import { getDynamicProps } from '/@/utils';
import { ref, onUnmounted, unref } from 'vue'; import { ref, onUnmounted, unref, watch } from 'vue';
import { isProdMode } from '/@/utils/env'; import { isProdMode } from '/@/utils/env';
import { isInSetup } from '/@/utils/helper/vueHelper'; import { isInSetup } from '/@/utils/helper/vueHelper';
import { error } from '/@/utils/log'; import { error } from '/@/utils/log';
import { watchEffect } from 'vue';
import type { FormActionType } from '/@/components/Form'; import type { FormActionType } from '/@/components/Form';
type Props = Partial<DynamicProps<BasicTableProps>>; type Props = Partial<DynamicProps<BasicTableProps>>;
@ -33,12 +32,18 @@ export function useTable(
} }
tableRef.value = instance; tableRef.value = instance;
formRef.value = formInstance; formRef.value = formInstance;
// tableProps && instance.setProps(tableProps); tableProps && instance.setProps(getDynamicProps(tableProps));
loadedRef.value = true; loadedRef.value = true;
watchEffect(() => { watch(
tableProps && instance.setProps(getDynamicProps(tableProps)); () => tableProps,
}); () => {
tableProps && instance.setProps(getDynamicProps(tableProps));
},
{
immediate: true,
}
);
} }
function getTableInstance(): TableActionType { function getTableInstance(): TableActionType {