表单变更值提取

13 阅读1分钟
import { get, set, isEqual } from 'lodash-es';
import { Obj } from '../typings';

export interface FieldConfig<T, K = string> {
    key: K; // 当前值的key
    getCurrentValue?: (values: T) => any;
    getOriginalValue?: (values: T) => any;
    originalKey?: string; // 原始值使用的key
    changedField?: string; // 变更值(需要return出去的值)使用key
    deepCompare?: boolean;
    currentDefaultValue?: any;
    changedFieldDefaultValue?: any;
}

export const processFormChangedFields = <T = Obj>(
    currentValues: T,
    originalValues: T,
    fieldConfig: FieldConfig<T>[],
    changedFields: Obj = {},
) => {
    fieldConfig.forEach(config => {
        const {
            key,
            getCurrentValue,
            getOriginalValue,
            originalKey = key,
            changedField = key,
            deepCompare,
            changedFieldDefaultValue,
            currentDefaultValue
        } = config;
        const currentValue = getCurrentValue ? getCurrentValue(currentValues as T) : get(currentValues, key, currentDefaultValue);
        const originalValue = getOriginalValue ? getOriginalValue(originalValues as T) : get(originalValues, originalKey);

        if (deepCompare) {
            if (!isEqual(currentValue, originalValue)) {
                set(changedFields, changedField, currentValue || changedFieldDefaultValue);
            }
        } else if (currentValue !== originalValue) {
            set(changedFields, changedField, currentValue || changedFieldDefaultValue);
        }
    });

    return changedFields;
};