生成一个默认的onChange
回调,这个回调会触发model.validate
如果不需要在onChange的时候触发校验,如下即可:
const onChange = useCallback(value => model.value = value, [model]);
例如是一个input
:
const onChange = useCallback((value: React.ChangeEvent<HTMLInputElement>) => {
model.value = e.target.value;
}, [model]);
可以配合usePipe使用:
function mapEventToValue(e) {
return e.target.value;
}
function Foo() {
const onChange = FieldUtils.usePipe(
mapEventToValue,
FieldUtils.useChangeHandler(model),
);
}
生成一组 onCompositionStart
和 onCompositionEnd
的回调函数,用于跟踪输入法 composition 的状态,
这个状态会写到 model.isCompositing
字段上。
用于记录状态的 model
对象
上层传入的被代理的回调
const callback = usePipe(foo, bar, baz)
is equal to
const callback = useMemo(() => arg => {
return baz(bar(foo(arg)))
}, [foo, bar, baz])
const callback = usePipe(foo, bar, baz)
is equal to
const callback = useMemo(() => arg => {
return baz(bar(foo(arg)))
}, [foo, bar, baz])
Generated using TypeDoc
example middleware
```tsx function when(condition: () => boolean | Promise): Middleware<IValidator> {
return (next: IValidator) =>
createAsyncValidator((value, ctx) => {
return of(condition()).pipe(
switchMap(cond => {
if (cond) {
return isAsyncValidator(next) ? next.validator(value, ctx) ?? of(null) : of(next(value, ctx));
}
return of(null);
}),
);
});
}
}
const validator = compose(when(() => Math.random() > 0.5))(required('required if random number great then 5'));