reactjs - ChakraUI 提示的 React.useRef

我无法弄清楚在以下来自 Chakra 文档的示例代码中，我需要为 React.useRef() 提供什么类型：

function UpdatingToastExample() {
  const toast = useToast()
  const toastIdRef = React.useRef()

  function update() {
    if (toastIdRef.current) {
      toast.update(toastIdRef.current, { description: "new text" })
    }
  }

  function addToast() {
    toastIdRef.current = toast({ description: "some text" })
  }

  return (
    <Stack isInline spacing={2}>
      <Button onClick={addToast} type="button">
        Toast
      </Button>

      <Button onClick={update} type="button" variant="outline">
        Update last toast
      </Button>
    </Stack>
  )
}

来自: https://chakra-ui.com/docs/feedback/toast#updating-toasts

Typescript 显然希望我为 React.useRef() 提供一个类型，但我不知道该给它什么类型？

 const toastIdRef = React.useRef<WhatTypeShouldThisBe?>(null);

我正在使用 chakra-ui/react v1.6.7 和 typescript 4.2.4。

答案＃1

看起来它要么是字符串，要么是数字：

const toastIdRef = React.useRef<number|string>(null);

看起来你可以导入 ToastId 类型：

吐司道具

ToastId 类型

export type ToastId = string | number

import { useToast, ToastId } from "@chakra-ui/toast";

...

const toastIdRef = React.useRef<ToastId>(null);