javascript - 将 redux 与 React hook 一起使用

Question

我正在尝试找出将 redux 与 React hooks 结合使用的最佳方法。我看到了以下内容

How to use React hooks + Redux

但是我不相信这是最好的方法。有人有其他想法吗？

我还看到了以下内容，看起来还不错。 https://www.npmjs.com/package/redux-react-hook

谢谢

Answer 1

官方 react-redux 包从 v7.1 开始提供钩子(Hook)。可以使用 Redux Hook 代替 connect(mapStateToProps, mapDispatchToProps) 函数。

useSelector()

使用选择器函数从 Redux 存储状态中提取数据。

useDispatch()

返回对可用于分派(dispatch)操作的分派(dispatch)的引用。

这是一个实现计数器的示例，其中计数器值由 Redux 管理。

import React from 'react'
import { useDispatch, useSelector } from 'react-redux'

export const CounterComponent = () => {
  const dispatch = useDispatch();
  const counter = useSelector(state => state.counter);

  return (
    <div>
      <span>{counter}</span>
      <button onClick={() => dispatch({ type: 'INCREMENT_COUNTER' })}>
        Increment counter
      </button>
    </div>
  );
}

来源:https://react-redux.js.org/api/hooks