我如何在 class 组件中使用 React redux？

Question

我是 redux 的新手，我想知道是否可以在 class 组件中使用 redux。 我们知道挂钩仅在 function 组件中有效，所以我导出一个 function 以使用useSelector访问商店：

import { useSelector, useDispatch } from "react-redux";

export default function Selector() {
  const counter = useSelector((state) => state.counter);
  return counter;
}

并将其导入compone组件，如下所示：

import React, { Component } from "react";
import selector from "../Store/selector";

export class Compone extends Component {
  componentDidMount() {
    console.log(selector());
  }
  render() {
    return (
      <>
        <h1>
          Counter: <span>0</span>
        </h1>
        <button style={{ marginRight: "10px" }}>Increase</button>
        <button>Decrease</button>
      </>
    );
  }
}

export default Compone;

然后我将compone组件导入App根组件：

import React, { Component } from "react";
import Compone from "../components/compone/Compone";
export class App extends Component {
  render() {
    return (
      <div>
        <Compone />
      </div>
    );
  }
}

export default App;

所以这对我不起作用，有没有办法在 class 组件中使用 redux？，

如何在 class 组件中使用 redux，如何在 class 组件中使用 React redux，

Answer 1

首先你必须创建一些actions和一些reducers 。
然后你需要使用 reducer 创建一个store 。
之后，您可以将react-redux的connect方法与您的 class 组件一起使用。