我有一个列表组件,需要一些时间才能加载。
我希望它在加载和安装之前显示一个旋转器,但不幸的是我尝试的一切都不起作用。
我正在尝试做这样的事情:
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}/>
);
});
}
}
我做错了什么?
最佳答案
如果您不知道哪个先出现,您应该同时检查 props.data 和 state.isReady:
render() {
if(this.state.isReady && this.props.data.length !== 0){
return (
<Content>
{this.renderList()}
</Content>
);
}
else {
return (
<Spinner/>
);
}
}
关于javascript - 如何在 React Native 中安装组件之前显示微调器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57846401/