React在componentWillMount中請求接口數據結束后再執行render

1.在getInitialState中初始化isloading，初始值false

getInitialState() {
        return {
            editionid: '',
            isloading:false
        }
}

2.

解決方法：

增加一個加載狀態，默認為 false，調用 componentWillMount() 時，設置為 true，當這個加載狀態是 true 時，暫不渲染，當回調函數執行完畢后，設置為 false，此時再調用 render()；

    componentWillMount() {
        //獲取當前請求的域名地址
        this.setState({isLoading: true})
        this.getShopId();
    },


    getShopId(){      
this.get({url:"Api/lists/module/shops/key/dac509bd90a82719a3569291e12c24a6f1af4bac/id/8",
        }).then((res)=> {
            console.log("res",res)
            if(res.error_code==0){
                let  editionid = res.result[0].editionid
                if(editionid==1) {
                    this.handleClickVideo('', videoDataInit2[0]);
                    this.setState({videoData:videoData1,videoDataFlag:true,rongqiuPic:rongqiuWz,editionid:editionid})
                }else if(editionid==2){
                    this.handleClickVideo('', videoDataInit[0]);
                    this.setState({videoData:videoData2,videoDataFlag:false,rongqiuPic:rongqiu,editionid:editionid})
                }else{
                    this.handleClickVideo('', videoDataInit[0]);
                    this.setState({videoData:videoData2,videoDataFlag:false,rongqiuPic:rongqiu,editionid:editionid})
                }
            }
            this.setState({isLoading: false})
        });
    },

3.最后對render進行處理

render() {
　　let {isLoading} = this.state
　　if (isLoading) {
　　　　return <p>isLoading...</p>
　　}
　　return (
　　　　<div>要顯示的部分</div>
　　)
}