在 react-redux 中调度后渲染

Question

我对 react-redux 有一个疑问。 组件必须在完成获取数据后呈现。当前代码总是返回{}。我该如何解决这个问题？

function Category(props) {
  const [categories, setCategories] = useState([]);
  props.dispatch(categoryActions.fetch());
  useEffect( () => {
    setCategories(props.categories)
  }, [props]);

  return (
    <Container className={classes.root}>
        .....
    </Container>
  );
}

const mapStateToProps = state => ({
    categories: state.categories,
});

function mapDispatchToProps(dispatch) {
    return {
      dispatch,
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(Category)

Answer 1

首先，我有几个问题：

1. const [categories, setCategories] = useState([]); 有什么作用？
   categories 由Connect 提供给Category 组件。
   useState 钩子用于定义和控制内部状态。 这在技术上并不冲突，因为您可以分别称它们为 props.categories 和 categories，但可能会有混淆。

2. 您想在组件中调度哪些操作？
   mapDispatchToProps 看起来什么都不做。 看看他们的official example。