這兩天弄了下父子組件提交的問題，這里整理下。
1. 父組件中，引入子組件，對子組件執(zhí)行React.forwardRef(子組件）來獲取傳遞給它的 ref，
配置子組件：<Child ref={React.useRef(null)} />
主要代碼如下：
const Child = forwardRef(FormItemTimeShedule);
{getFieldDecorator('scheduleList', {
? ? ? ? validateTrigger: ['onBlur'],
? ? ? ? rules: [
? ? ? ? ? ? {
? ? ? ? ? ? ? ? validator(_, value, callback) {
? ? ? ? ? ? ? ? ? ? value.some(item => {
? ? ? ? ? ? ? ? ? ? ? ? const errorMessage = childRef.current.getValidateError(item);
? ? ? ? ? ? ? ? ? ? ? ? if (errorMessage) {
? ? ? ? ? ? ? ? ? ? ? ? ? ? callback(errorMessage);
? ? ? ? ? ? ? ? ? ? ? ? ? ? return true;
? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? ? ? return false;
? ? ? ? ? ? ? ? ? ? });
? ? ? ? ? ? ? ? ? ? callback();
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? ],
? ? ? ? initialValue: relativeLinkData
})(<Child ref={React.useRef(null)} {...itemProps}/>)}
2.子組件：
定義const FormItemTimeShedule = ( props, childRef) => {....}
使用useImperativeHandle定義暴露給父組件的參數(shù)；
? useImperativeHandle(childRef,()=>(
? ? getValidateError
? }))
//執(zhí)行校驗
const getValidateError = item => {
? ? let msg;
? ? validators.some(item => {
? ? ? ? if (!item.validator(startTime)) {
? ? ? ? ? ? msg = item.message;
? ? ? ? ? ? return true;
? ? ? ? }
? ? ? ? return false;
? ? });
? ? return msg;
};
主要還是卡在forwardRef和useImperativeHandle這里，注意React版本是16以上，我是寫的函數(shù)式組件。
