redux ，无效的钩子调用。钩子只能在函数组件体内调用

Question

当我在 root.render 中设置并使用 Provider 时，它向我显示此错误：

警告：无效的挂钩调用。钩子只能在内部调用 函数组件的主体。这可能发生在其中一个 原因如下：

1. 您的 React 和渲染器版本可能不匹配（例如 React DOM）
2. 您可能违反了 Hooks 规则
3. 您可能在同一应用中拥有多个 React 副本，并且未捕获 TypeError：无法读取 null 的属性（读取“useMemo”）

它只是针对 Provider 组件，如果我不调用它，就不会出现此错误。

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { Provider } from 'react-redux';

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <Provider>
    <App />
  </Provider>
);

reportWebVitals();

我卸载了 redux 和 npm 包，然后使用最新版本安装它们，但我遇到了同样的问题。有人说可能是因为两个包中有相同的名称，这会让计算机感到困惑，但我不这么认为。

Answer 1

您需要将store传递给Provider

import React from 'react';
import ReactDOM from 'react-dom/client';

import App from './App';
import reportWebVitals from './reportWebVitals';
import { Provider } from 'react-redux';
import store from "./path/to/store"

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <Provider store={store}>
    <App />
  </Provider>
);

reportWebVitals();