RN setState 采坑小记

项目中我们基本上一直使用这个东东,一般我们用来刷新数据(刷新页面),下面来小记下这个小坑

一般对页面来说 我们如是使用

第一种写法 声明、初始化分开

// 1、声明
export interface IState {
    bidBtnData: getBidButtonData,
    bidBean: IBidDetailInfo,
}

export interface IProps extends IBasePageProp {

}

export default class extends UtilsRootPage<IProps, IState> {

//该方法 相当于constructor 初始化方法

  subPageInit() {

// 2、初始化
        this.state = {
            bidBean: {} as IBidDetailInfo,
            bidBtnData: {} as getBidButtonData,
        }

    }
// 3、赋值

    this.setState({ bidBean: response.data })

第二种写法 直接声明、初始化

export default class CheckboxModalMenu extends React.Component<IProps> {
// 1、声明、初始化
    state = {
        modalVisible: false,
        data: [],
        bidderIdList: [],
    };
// 2、使用

  this.setState({ data: res.data.rows });

小坑小记：setState是异步操作 所以出现赋值异常时 用方法2解决

                                let oData: any = this.state.data;
                                let oNew: any = [];
                                oData.map((fItem: any) => {
                                    if (fItem.checkedflag) {
                                        oNew.push(fItem.userId);
                                    }  
                                });
                                // UtilsSuperCommon.logWarn(oNew);
                                // oNew始终有值 第一次bidderIdList取不到值 第二次才有 这是因为setState是异步操作 
                                // 所以用第二种写法 数据回来后再做操作
                                // 1、
                                // this.setState({
                                //     bidderIdList: oNew, 
                                // }
                                //2、 该操作是异步操作
                                this.setState({
                                    bidderIdList: oNew,
                                }, ()=> {
                                    if (this.state.bidderIdList && this.state.bidderIdList.length) {
                                        this.setModalVisible(false);
                                        this.props.onClickDone(this, this.state.bidderIdList);
                                    } else {
                                        Toast.info('请选择中标人', 1)
                                    }
                                })
                                // UtilsSuperCommon.logWarn(this.state.bidderIdList);