在 react-redux 中分派后渲染
Rendering after dispatch in react-redux
我对react-redux 有一点疑问。
组件必须在完成获取数据后呈现。当前代码 returns 总是 {}
。我该如何解决这个问题?
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)
首先,我有一些问题:
const [categories, setCategories] = useState([]);
是做什么的?
categories
由 Connect
作为道具提供给 Category
组件。
useState
hook用于定义和控制内部状态。
这在技术上并不冲突,因为您可以分别称它们为 props.categories
和 categories
,但可能会混淆。
您想在组件中调度什么操作?
mapDispatchToProps
看起来什么也没做。
看看他们的 official example。
我对react-redux 有一点疑问。
组件必须在完成获取数据后呈现。当前代码 returns 总是 {}
。我该如何解决这个问题?
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)
首先,我有一些问题:
const [categories, setCategories] = useState([]);
是做什么的?
categories
由Connect
作为道具提供给Category
组件。
useState
hook用于定义和控制内部状态。
这在技术上并不冲突,因为您可以分别称它们为props.categories
和categories
,但可能会混淆。您想在组件中调度什么操作?
mapDispatchToProps
看起来什么也没做。 看看他们的 official example。