反應-在渲染DOM時加載屏幕嗎？

Question

我想顯示加載屏幕，直到呈現DOM。 在我的程序中。 我正在檢查是否有設備，然后它將顯示加載頁面，直到呈現DOM為止，否則顯示未找到任何設備。

但是頁面顯示未找到任何設備，然后在呈現DOM之后顯示設備。 如果存在渲染DOM之前的設備，如何解決此問題並顯示“正在加載”消息。

渲染設備也需要時間。 因此，我無法檢查是否有設備-這就是“首先找不到設備”的原因。

render() {
    const { devices } = this.props;

    if (this.state.isLoading) {
        return (
            <div>Loading!!!!!</div>
        );
    }
    if (devices && devices.length > 0) {
        return (
            <div> // Devices table will be displayed
            </div>
        );
    } else {
        return (
            <div>
                No Devices found
            </div>
        );
    }
}

Answer 1

render() {
    const { devices } = this.props;

      if (devices && devices.length > 0) {
          return (
                <div> // Devices table will be displayed
                </div>
        );
       }else {
if(this.state.loading){                   //Not sure how you set the state
return ( <div>Loading...</div>)  
}

        return (
            <div>
                No Devices found
            </div>
        );
    }
}