“输入"类型上不存在属性“模糊" [英] Property 'blur' does not exist on type 'Input'

问题描述

我正在使用 useRef 钩子将 ref 属性传递到我的自定义 FieldInput 组件中.然后用于验证我的表单.

I am using the useRef hook to pass a ref property into my custom FieldInput component. This is then used for the validation of my form.

const fieldRef = useRef();
...
    const handleSubmitForm = (
    values: FormValues,
    helpers: FormikHelpers<FormValues>,
  ) => {
 ....
    fieldRef.current.blur();
    helpers.resetForm();
  };

但是，我在 fieldRef.current 上收到一个错误，即 Object 可能是未定义的"..为了解决这个问题，我进行了以下更改:

However, I get an error on fieldRef.current that Object is possibly 'undefined'.. In order to fix that, I made these changes:

const fieldRef = useRef<Input>(null);
...
fieldRef.current?.blur();

但是，我仍然收到一个错误:输入"类型上不存在属性模糊"..这里，Input 是从 native-base 导入的.因此，当我提交表单时，我会收到类型错误/警告.从 submitForm() 捕获未处理的错误我怎样才能摆脱这些错误?

However, I still get an error that Property 'blur' does not exist on type 'Input'.. Here, Input is imported from native-base. Due to this, I get type errors/warnings when I submit the form. An unhandled error was caught from submitForm() How can I get rid of these errors?

在 codesandbox 中复制了完整场景:https://snack.expo.io/@nhammad/jealous-beef-jerky-fix

The full scenario is replicated here in a codesandbox: https://snack.expo.io/@nhammad/jealous-beef-jerky-fix

推荐答案

好的，首先，在您的 FieldInput 组件中，您将这些事件处理程序传递给 Input像这样:<Input onCahnge={callback()}/>，而不是这样做: callback()}/> .您没有传递回调，而是调用它们并将它们的结果作为事件处理程序传递.这导致您的组件出错.

Ok, so first of all, in your FieldInput component, you passed those event handlers to Input like this : <Input onCahnge={callback()}/> , instead of doing it like this : <Input onChange={()=>callback()}/> . Instead of passing your callbacks, you called them and passed in their result as the event handlers. This caused an error in your component.

在修复该问题并获得类型提示后，blur 仍然被编辑器发出信号为 Input 类型缺失.查看文档并尝试控制台记录 ref 元素后，似乎实际上没有公开 blur 方法.来自 react-native 的 TextField 暴露了它，但没有转发到 native-base Input

After fixing that and getting type hints working, blur was still signaled by the editor as missing from type Input. After looking over the docs, and trying to console log the ref element, it seems like there is actually no blur method exposed. TextField from react-native has it exposed, but is not forwarded to native-base Input

这篇关于“输入"类型上不存在属性“模糊"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！