React 延迟渲染，而获取调用填充 Redux 存储

Question

有没有办法在进行获取调用以填充 Redux 存储时延迟 Rereact 渲染，以便当渲染从存储调用 this.props 时，数据已经存在？我有一个问题，即渲染方法中的存储调用正在调用当前为空对象的存储，并导致渲染崩溃。

到目前为止，我想出的解决方案是使用空数据制作一个空 JSON，渲染首先调用该数据，然后在获取成功时调用现在填充的 Redux 存储，但是有没有更有效的方法？

Answer 1

你不想延迟任何渲染，这是一个部分或反应功能。

它在获取新数据(道具、状态(时呈现。

在您的情况下，您需要解决不同的"数据情况">

所以首先你的化简器应该有一个默认状态，即：

{
"loading": false,
"username": null,
"isLoaded": false
}

现在，在您的代码中，您可以处理不同的数据并相应地呈现差异视图

const YourComponent = props => {
if (props.loading) {
return <h1>loading</h1>
}
if (props.loaded && props.username==null) {
return <h1>cant find user</h1>
}
return <h1>{props.username} is loaded</h1>
}

这只是一个例子，你的代码应该更好，更有条理:)