Question

我是打字稿新手。我想将一个函数分配给自定义钩子中的ref。这样函数就不会在渲染过程中发生变化。

Codesandbox链接。 https://codesandbox.io/s/918l0wro4r

function something(params?: any) {
  console.error('params: ', params);
}
const someRef = React.useRef(null); //how do i assign type here.
async function someAsyncFunc() {
  try {
    const a = await something();
    something(a);
  } catch (error) {
    something(error);
  }
}

someRef.current = someAsyncFunc; // ts error here. need help here

Answer 1

useRef是generic type。您需要添加一个类型参数来告诉TypeScript您要使用哪些值。在您的情况下，参考的初始化代码如下所示：

const someRef = React.useRef<Function>()

Function类型允许将任何功能用作参考。如果您有特定的形状，则可能需要缩小一点。例如，您的情况就是这样：

const someRef = React.useRef<() => Promise<void>>();
async function someAsyncFunc() {
  // ...
}
someRef.current = someAsyncFunc;

如何使用带有typescript的useRef分配给ref的函数？

1 个答案: