- 此问题在此处已有答案**:
React/Typescript - when using ref I get typescript error - Property 'current' does not exist on type '(instance: HTMLInputElement | null) => void'(2个答案)
4天前关闭。
我的应用程序. tsx如下所示
import { useRef, useState } from "react";
import InputField from "./InputField";
import "./styles.css";
export default function App() {
const checkInRef = useRef<HTMLInputElement>(null);
return (
<InputField
ref={checkInRef}
/>
);
}
InputField.tsx看起来像这样
import {
Dispatch,
SetStateAction,
forwardRef,
} from "react";
const InputField = forwardRef<HTMLInputElement>(function (props, ref) {
return (
<div>
<input ref={ref} />
<button onClick={() => ref.current.focus()}>focus</button>
</div>
);
});
export default InputField;
上面的代码按预期工作,点击按钮聚焦输入字段。但是我得到2个打字错误
"" ref "可能为" null "。"
类型"((示例:)"上不存在属性"current"HTML输入元素|空)=〉无效)|可变引用对象〈HTML输入元素|属性"current"在类型"(示例:HTML输入元素|空)=〉空'。
我知道我可以不使用forwardRef而将ref作为RefObject传递给带有props的Fc。但我想使用forwardRef来完成此操作
1条答案
按热度按时间pb3skfrl1#
像这样定义
ref
类型