为什么当状态发生变化时 mapStateToProps return 空对象?
Why mapStateToProps return empty object when state has been mutated?
我创造行动
export const KIDS_LOAD = 'KIDS_LOAD';
export const kidsLoad = (data) => ({
type: KIDS_LOAD,
payload: data ,
});
我创建减速器
import { KIDS_LOAD } from '../customActions/KidsActions';
export default (state = {}, { type, payload }) => {
if (type === KIDS_LOAD) {
return { ...state,
img: payload.img,
kidsInfo: payload.kidsInfo
};
}
return state;
}
我派遣行动
componentWillMount() {
this.props.setSidebarVisibility(true);
const { kidsLoad, record } = this.props;
kidsLoad({
img : 'https://s18670.pcdn.co/wp-content/uploads/care_about_grades_middle_school.jpg',
kidsInfo: {
kidName : 'Sasha',
kidAge : '19',
kidHandType : 'Right',
kidGender : 'Boy',
}
})
console.log( this.props.kidsTabData)
}
我映射状态
const mapStateToProps = state => ({
kidsTabData: state.kidsReducer,
isLoading: state.admin.loading > 0,
});
export default connect(mapStateToProps, { setSidebarVisibility, kidsLoad })(withStyles(styles)(MyLayout));
商店发生变化
但是console.log(this.props.kidsTabData)return空对象{}。
你能看出我哪里错了吗?在我看来,一切都正确地进入了商店,但 initialState 得到了道具。
redux 操作 kidsLoad
是异步的。
在 componentDidUpdate
中尝试 console.log
componentDidUpdate(){
console.log(this.props.kidsTabData)
}
我创造行动
export const KIDS_LOAD = 'KIDS_LOAD';
export const kidsLoad = (data) => ({
type: KIDS_LOAD,
payload: data ,
});
我创建减速器
import { KIDS_LOAD } from '../customActions/KidsActions';
export default (state = {}, { type, payload }) => {
if (type === KIDS_LOAD) {
return { ...state,
img: payload.img,
kidsInfo: payload.kidsInfo
};
}
return state;
}
我派遣行动
componentWillMount() {
this.props.setSidebarVisibility(true);
const { kidsLoad, record } = this.props;
kidsLoad({
img : 'https://s18670.pcdn.co/wp-content/uploads/care_about_grades_middle_school.jpg',
kidsInfo: {
kidName : 'Sasha',
kidAge : '19',
kidHandType : 'Right',
kidGender : 'Boy',
}
})
console.log( this.props.kidsTabData)
}
我映射状态
const mapStateToProps = state => ({
kidsTabData: state.kidsReducer,
isLoading: state.admin.loading > 0,
});
export default connect(mapStateToProps, { setSidebarVisibility, kidsLoad })(withStyles(styles)(MyLayout));
商店发生变化
但是console.log(this.props.kidsTabData)return空对象{}。
你能看出我哪里错了吗?在我看来,一切都正确地进入了商店,但 initialState 得到了道具。
redux 操作 kidsLoad
是异步的。
在 componentDidUpdate
componentDidUpdate(){
console.log(this.props.kidsTabData)
}