0

我正在制作一个表单，我需要将react-dropzone与react-hook-form集成在一起，为此，我将自己置于 Github 上的讨论中：https ://github.com/react-hook-form/react-钩形/讨论/2146。但是在解构useFormContext的时候，如下：

const { control } = useFormContext();

我收到以下错误：

TypeError: Cannot destructure property 'control' of 
'(0 , react_hook_form__WEBPACK_IMPORTED_MODULE_2__.useFormContext)(...)' as it is null.

我做了一些研究，发现了这个问题：react-hook-form empty context，开发人员遇到的问题与我的非常相似。找到的解决方案是

基本上我需要的只是在 webpack 配置中添加 react-hook-form 作为外部库，现在 csb 正在工作:)

我对 webpack 知之甚少，尤其是在 Nextjs 内部。但是在研究和阅读文档之后，这是我的尝试：

/next.config.js

module.exports = {
  webpack: (config, options) => {
    config.externals.push({
      'react-hook-form': 'react-hook-form',
    });

    return config;
  },
  ...
}

但错误仍然是一样的。你知道我该如何解决这个问题吗？

4

1 回答 1

1

感谢@juliomalves 的评论，我解决了这个问题。问题是我忘了用FormProvider组件包装我的表单。给出错误是因为没有提供control给 my 的上下文useFormContext，因此无法解构它。

于 2021-10-27T11:51:59.090 回答