javascript - 如果元素存在则条件渲染

Question

我有 React 组件，它使用 axios 从 MySQL 调用数据并渲染它。问题是，如果我想显示消息，如果我没有任何数据。我的代码如下所示。

    render() {

    return (
        <div>
            {this.state.elements.length < 1 ? (
                <p>Elements doesn't exist</p>
            ) : (
                <ul>
                    { this.state.elements.map(element => <li key={element.id}>{element.name}</li>)}
                </ul>
            )}
        </div>

    );
}

此代码有效，但在渲染列表之前显示错误半秒。我知道问题是对 MySL 的请求和调用数据的延迟，但我如何才能避免这种情况？

Answer 1

添加setTimeout，默认情况下它将等待1分钟，然后从数据库渲染数据