feat: 1、FieldMappingTime拆解独立FieldMappingTimeItem+集合形式,方便单独对象定义;
2、表单submitOnChange增加changeDebouncedTime防抖处理,允许自定义防抖周期; 3、handleValuesChange事件set增加cloneDeep,防止对象值污染;
This commit is contained in:
@@ -16,6 +16,6 @@ export * from './unique';
|
|||||||
export * from './update-css-variables';
|
export * from './update-css-variables';
|
||||||
export * from './util';
|
export * from './util';
|
||||||
export * from './window';
|
export * from './window';
|
||||||
export { get, isEqual, set } from 'es-toolkit/compat';
|
export { debounce, get, isEqual, set } from 'es-toolkit/compat';
|
||||||
// export { cloneDeep } from 'es-toolkit/object';
|
// export { cloneDeep } from 'es-toolkit/object';
|
||||||
export { default as cloneDeep } from 'lodash.clonedeep';
|
export { default as cloneDeep } from 'lodash.clonedeep';
|
||||||
|
|||||||
@@ -342,7 +342,7 @@ export type HandleResetFn = (
|
|||||||
values: Record<string, any>,
|
values: Record<string, any>,
|
||||||
) => Promise<void> | void;
|
) => Promise<void> | void;
|
||||||
|
|
||||||
export type FieldMappingTime = [
|
export type FieldMappingTimeItem = [
|
||||||
string,
|
string,
|
||||||
[string, string],
|
[string, string],
|
||||||
(
|
(
|
||||||
@@ -351,7 +351,9 @@ export type FieldMappingTime = [
|
|||||||
| null
|
| null
|
||||||
| string
|
| string
|
||||||
)?,
|
)?,
|
||||||
][];
|
];
|
||||||
|
|
||||||
|
export type FieldMappingTime = FieldMappingTimeItem[];
|
||||||
|
|
||||||
export type ArrayToStringFields = Array<
|
export type ArrayToStringFields = Array<
|
||||||
| [string[], string?] // 嵌套数组格式,可选分隔符
|
| [string[], string?] // 嵌套数组格式,可选分隔符
|
||||||
@@ -525,6 +527,11 @@ export interface VbenFormProps<
|
|||||||
*/
|
*/
|
||||||
submitOnChange?: boolean;
|
submitOnChange?: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* submitOnChange改变时防抖时间 | 默认300ms
|
||||||
|
*/
|
||||||
|
changeDebouncedTime?: number;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 是否在回车时提交表单
|
* 是否在回车时提交表单
|
||||||
* @default false
|
* @default false
|
||||||
|
|||||||
@@ -3,7 +3,6 @@ import type { Recordable } from '@vben-core/typings';
|
|||||||
|
|
||||||
import type { ExtendedFormApi, VbenFormProps } from './types';
|
import type { ExtendedFormApi, VbenFormProps } from './types';
|
||||||
|
|
||||||
// import { toRaw, watch } from 'vue';
|
|
||||||
import { nextTick, onMounted, watch } from 'vue';
|
import { nextTick, onMounted, watch } from 'vue';
|
||||||
|
|
||||||
import { useForwardPriorityValues } from '@vben-core/composables';
|
import { useForwardPriorityValues } from '@vben-core/composables';
|
||||||
@@ -12,17 +11,10 @@ import { cloneDeep, get, isEqual, set } from '@vben-core/shared/utils';
|
|||||||
import { useDebounceFn } from '@vueuse/core';
|
import { useDebounceFn } from '@vueuse/core';
|
||||||
|
|
||||||
import FormActions from './components/form-actions.vue';
|
import FormActions from './components/form-actions.vue';
|
||||||
import {
|
import { COMPONENT_BIND_EVENT_MAP, COMPONENT_MAP, DEFAULT_FORM_COMMON_CONFIG } from './config';
|
||||||
COMPONENT_BIND_EVENT_MAP,
|
|
||||||
COMPONENT_MAP,
|
|
||||||
DEFAULT_FORM_COMMON_CONFIG,
|
|
||||||
} from './config';
|
|
||||||
import { Form } from './form-render';
|
import { Form } from './form-render';
|
||||||
import {
|
import { provideComponentRefMap, provideFormProps, useFormInitial } from './use-form-context';
|
||||||
provideComponentRefMap,
|
|
||||||
provideFormProps,
|
|
||||||
useFormInitial,
|
|
||||||
} from './use-form-context';
|
|
||||||
// 通过 extends 会导致热更新卡死,所以重复写了一遍
|
// 通过 extends 会导致热更新卡死,所以重复写了一遍
|
||||||
interface Props extends VbenFormProps {
|
interface Props extends VbenFormProps {
|
||||||
formApi?: ExtendedFormApi;
|
formApi?: ExtendedFormApi;
|
||||||
@@ -65,7 +57,7 @@ function handleKeyDownEnter(event: KeyboardEvent) {
|
|||||||
|
|
||||||
const handleValuesChangeDebounced = useDebounceFn(async () => {
|
const handleValuesChangeDebounced = useDebounceFn(async () => {
|
||||||
state?.value.submitOnChange && forward.value.formApi?.validateAndSubmitForm();
|
state?.value.submitOnChange && forward.value.formApi?.validateAndSubmitForm();
|
||||||
}, 300);
|
}, state?.value?.changeDebouncedTime ?? 300);
|
||||||
|
|
||||||
const valuesCache: Recordable<any> = {};
|
const valuesCache: Recordable<any> = {};
|
||||||
|
|
||||||
@@ -87,7 +79,7 @@ onMounted(async () => {
|
|||||||
const oldFieldValue = get(valuesCache, field);
|
const oldFieldValue = get(valuesCache, field);
|
||||||
if (!isEqual(newFieldValue, oldFieldValue)) {
|
if (!isEqual(newFieldValue, oldFieldValue)) {
|
||||||
changedFields.push(field);
|
changedFields.push(field);
|
||||||
set(valuesCache, field, newFieldValue);
|
set(valuesCache, field, cloneDeep(newFieldValue));
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user