为啥当状态发生突变时 mapStateToProps 返回空对象？

Posted 2023-03-31

【中文标题】为啥当状态发生突变时 mapStateToProps 返回空对象？

【英文标题】：Why mapStateToProps return empty object when state has been mutated?为什么当状态发生突变时 mapStateToProps 返回空对象？

【发布时间】：2019-02-10 16:02:13

【问题描述】：

我创建动作

export const KIDS_LOAD = 'KIDS_LOAD';
export const kidsLoad = (data) => (
    type: KIDS_LOAD,
    payload: data ,
);

我创建reducer

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) 返回空对象 。

你能告诉我哪里错了吗？在我看来，一切都正确地进入了商店，但 initialState 进入了道具。

【参考方案1】：

redux 操作kidsLoad 是异步的。 在componentDidUpdate中试试console.log

componentDidUpdate()
    console.log(this.props.kidsTabData)