Typescript 在React本机功能组件中未定义useRef.current

我试图在用户单击按钮后聚焦文本输入字段。代码如下所示：

const refName = React.useRef();

const changeFocus = () => {
    refName.current.focus();
}

文本输入的属性

ref

定义为

refName

。 这给了我一个错误（

undefined不是一个对象（评估'refName.current.focus'）

），当我将

changeFocus

函数重写为

console.log（refName）

时，我得到的结果是：

Object {
  "current": undefined,
}

我不确定应该如何定义引用，或者如何处理这个问题。

---

谢谢

您在没有值的情况下初始化了ref，因此在获取附加组件的值之前，

ref.current

将有一个时刻是

未定义的

您需要将函数调用设置为有条件的，以便仅当设置了
ref.current
时，函数调用才会发生：

const changeFocus = () => {
    refName.current?.focus();
}

您还需要声明ref的预期类型，因为它不能从初始值推断出来。类型可以是特定组件的类型，也可以是：

interface Focusable {
  focus(): void;
}

const refName=React.useRef（）；

这将修复在组件上设置
ref
属性时出现的错误。
这是否回答了您的问题？你能分享完整的组件吗？
const refName = React.useRef<Focusable>();