基于react antd的表单显隐控制

基于react antd的表单显隐控制

显隐方法:

type FormConf = Record;
export const defineFormConfig = (originForm: any, newForm: FormConf) => {
  if (!isArray(originForm) || !isObject(newForm)) { 
    return originForm; 
  };

  originForm.forEach((item: any) => {
    if (item?.type !== 'select' && isArray(item?.lists)) {
      defineFormConfig(item?.lists, newForm);
    }
    const conf = newForm[item?.key];
    if (isObject(conf)) {
      Object.assign(item, conf);
    }
  })
  return originForm;
}

表单中的使用:

export const COL = [
  {
    key: 'id',
    title: 'id',
    visible: true,
  },
  {
    key: 'parameterId',
    title: 'parameterId',
    disabled: true,
  },
]
{( defineFormConfig(COL, { parameterName: { disabled: modalTitle === t('edit') }, }) || [] ).map((item: any) => { const { title, required = false, disabled = false } = item; return ( { title === 'parameterContent' ? : } ) } )}

你可能感兴趣的:(前端react.jsantd)