时间戳

首页 > 解决方案 > Redux Store Props 无法及时用于 React Constructor

javascript - Redux Store Props 无法及时用于 React Constructor

问题描述

我已经使用 Redux 和 React 工作了几个月。我通常总是毫无问题地使用 Chrome。（实际上是无尽的错误:)）。

当我开始在 Firefox 中进行测试时，我遇到了一个问题，我需要一些帮助......要知道是否有一个完美的方法来处理这个......

调用构造函数时，MapStateToProps 的问题 Redux Props 尚不可用，这意味着我无法在组件构造函数中构造组件状态。这些道具随后在渲染功能中迅速可用。在这个阶段，为时已晚，因为我无法在渲染函数中构造状态（可以以某种方式工作，但不是很好接近吗？）。

目前我正在使用 componentWillReceiveProps 并复制我的构造函数，但有一个例外

构造函数

constructor(props){
super(props);
//Loads of code named A
this.state = {state:A};
}

组件将接收道具功能

componentWillReceiveProps (){
//Loads of code named A
this.setState({state:A});
}

在这里覆盖我的状态可能存在问题，但对于我在这里的确切情况，它只显示数据，没有 UI 更改发生......这两种方法都不是正确的方法......

我读了这篇文章 https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html

我不太确定我是否完全理解这一点。我确实对它进行了一些实验，但没有任何可行的解决方案。

理想情况下，我需要构造函数暂停，直到所有 redux 存储都被填充，这也没有意义。道具数组可以是空的。

有关于 Slack 的讨论，但似乎没有一个确切地解决这个问题。我尝试谷歌搜索问题，但找不到解决的确切问题......

我需要 mapStateToProps 道具来构建我的状态。看起来我无法做到这一点，并且需要完全重构代码以在渲染函数中更多地工作，并加载三元运算符和/或在渲染返回之前从渲染函数调用设置状态。

对这个问题有什么想法吗？

丹尼尔

标签： javascriptreactjsreduxreact-redux

解决方案

为什么你认为你需要将你从 props 获得的数据放入组件状态？就使用数据而言，两者之间没有区别，只是如果您将道具复制到状态（请参阅您发布的链接），您更有可能遇到麻烦。

const { A } = this.state;
const { A } = this.props;

如果数据是通过异步方法来的，那么你应该在你的渲染方法中适应它。

render() {
  const { A } = this.props;
  if (!A) {
    return <LoadingIndicator />
  }
  ...
}

推荐阅读