Question

我创建了一个非常简单的自定义钩子：


export function useI18n() : [ string, Dispatch<SetStateAction<string>> ] {
  const [ language, setLanguage ] = useState<string>(i18n.language)

  useEffect(() => {
    i18n.changeLanguage(language)
  }, [ language ])

  return [ language,  setLanguage ];
}

在我的组件中，我像这样使用这个钩子：

const [language, setLanguage] = useI18n();

我正在使用react-scripts，当我做npm start时，我得到以下信息：

Failed to compile.

./src/config/i18n.ts
  Line 0:  Parsing error: Cannot read property 'map' of undefined

但是，如果我将钩子设置为返回对象而不是数组，则不会发生此错误，

export function useI18n() : { language: string, setLanguage: Dispatch<SetStateAction<string>> } {
  const [ language, setLanguage ] = useState<string>(i18n.language)

  useEffect(() => {
    i18n.changeLanguage(language)
  }, [ language ])

  return { language,  setLanguage };

在这种情况下，我这样称呼它：

const { language, setLanguage } = useI18n();

有人知道为什么返回数组会导致编译失败吗？也许我在犯一些奇怪的错误。预先感谢。

数组返回类型上的自定义React Hook打字稿错误

0 个答案: