无法在渲染中访问React Redux道具

Question

我目前在显示Redux状态树中的某些结果时遇到问题。在我的控制台中，它向我显示在调用this.props.walletStocks（存储在redux状态树中）之后，当前对象已到达。

但是，当我运行以下代码时，它告诉我this.props.walletStocks ['wallet4']未定义，因此尚未到达。

render() {
    return(
       {this.props.walletStocks['wallet4'].map((stock) => console.log(stock))}
    );
}

我知道异步数据存在问题，我真的不知道该如何解决。

谢谢！

Answer 1

一种适当的解决方案是在启动异步数据请求时设置加载状态，并在异步数据加载完成后（例如，使用Promise API）对其进行更新。然后使用该加载状态来确定要渲染的内容。

您的redux操作中的某处：

# x^(1/3)
df_log2 <- mutate_if(df, is.numeric, .funs = function(x){x^(1/3)})

也为组件提供加载状态，并根据该标志在Promise.resolve() .then(() => dispatch({ type: UPDATE_WALLET_STOCKS, loading: true, }) .then(fetch('https://YOU_API')) .then(json => json.json()) .then(walletStocks => dispatch({ type: UPDATE_WALLET_STOCKS, walletStocks, loading: false, }); 呈现中：

YourComponent

Answer 2

您需要等待其加载然后显示。尝试检查一下。

render() {
return(
   {this.props.walletStocks && this.props.walletStocks['wallet4'].map((stock) => console.log(stock))}
);

}