Question

我正在尝试在React应用中使用需要Redux的useDispatch()的组件进行测试。我收到错误

找不到react-redux上下文值；请确保组件包装在
中

除了使用redux的useDispatch()的组件外，我在其他任何组件上都没有得到这样的错误。

这是错误

它显示了组件的一部分

  could not find react-redux context value; please ensure the component is wrapped in a <Provider>

  10 |   //props so I can re-use it on homepage and in user page.
  11 |   const [query, setQuery] = useState('')
> 12 |   const dispatch = useDispatch()
     |                    ^
  13 | 
  14 |   const handleCriterionChange = () => {
  15 |     const value = document.getElementById("searchCriteria").value;

Answer 1

您可能没有在Provider中呈现经过测试的组件，但是将整个应用程序包装为一个，因此调度从该应用程序传递下来。您需要在测试中另外包装该组件。

// In your test
render(<Providers store={YOUR STORE}>YOUR COMPONENT</Provider>)

这将使经过测试的组件访问调度。

您还可以生成一个帮助程序，该帮助程序将要测试的组件传递给它，以自动将其包装在提供程序中：

function renderWithWrapper = children => <Providers store={YOUR STORE}>{children}</Provider>

开玩笑地测试redux连接的组件给出错误“请确保该组件包装在<Provider>中”

1 个答案: