Javascript 在组件安装到React Native之前，如何显示微调器？

我有一个列表组件，需要一些时间才能加载

我希望它显示一个微调器，直到它被加载和安装，但不幸的是，我尝试的一切都不起作用

我正在尝试这样做：

class List extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            isReady: false,
        };
    }

    componentDidMount() {
        this.setState({isReady: true});
    }

    render() {
        if(this.state.isReady){
            return (
                <Content>
                    {this.renderList()}
                </Content>
            );
        }
        else {
            return (
                <Spinner/>
            );
        }

    }

    renderList() {
        return this.props.data.map((item, index) => {
            return (
                <ListItem type={this.props.type} text={item} key={index}/>
            );
        });
    }
}

类列表扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
伊斯雷迪：错，
};
}
componentDidMount（）{
this.setState（{isReady:true}）；
}
render（）{
如果（此.state.isReady）{
返回(
{this.renderList（）}
);
}
否则{
返回(
);
}
}
renderList（）{
返回此.props.data.map（（项目，索引）=>{
返回(
);
});
}
}

---

我做错了什么？

如果不知道哪一个先到，您应该检查props.data和state.isReady：

    render() {
        if(this.state.isReady && this.props.data.length !== 0){
            return (
                <Content>
                    {this.renderList()}
                </Content>
            );
        }
        else {
            return (
                <Spinner/>
            );
        }

    }

render（）{
if（this.state.isReady&&this.props.data.length！==0）{
返回(
{this.renderList（）}
);
}
否则{
返回(
);
}
}

我认为您应该在

构造函数中初始化
isLoading
状态为
true
，然后在
componentDidMount
中将其设置为
false

然后尝试
渲染
，而
正在加载
是
真的
你如何接收这个.props.data？@christophengo发送一个静态数组到数据prop然后可能你的应用程序太快了哈你放在这里的代码没有问题。如果出现问题，可能是微调器或内容组件的问题。不，加载需要1-2秒，但加载在空屏幕上-微调器并不坏。添加了
this.props.data.length！==0
。现在重试？如果（！this.state.isReady）正常显示微调器。纺纱工没帮上忙：（发生什么事了，兄弟？