Question

React - 初始化时未设置状态

2019-04-12

1394

javascript reactjs

我的产品组件中有此代码，用于将收到的道具分配给状态当我创建新产品并通过更改产品列表的状态将其呈现在父级上并因此重新加载产品时，不会分配此状态，即使对于现有对象，颜色和尺寸也不会出现，除非您先加载页面然后刷新它。

实现如下：

1）它们在产品类的状态中定义

 this.state = {
  colorsPicked: [],
  newProductSizes: []
};

2）它们作为道具传递到组件的父类中，如下所示：

           <Product
            colors={product.colors}
            sizes={product.sizes}
            updateProducts={this.updateProducts}
          />

3）它们据称在产品类中设置如下：

async componentWillReceiveProps(props) {
 this.setState({
  colorsPicked: props.colors,
  newProductSizes: props.sizes
});

Answer 1

尝试通过构造函数设置它们：

class Item extends Component {
    constructor(props) {
        this.state = {
            colorsPicked: props.colors,
            newProductSizes: props.sizes
        }
    }
}

Answer 2

我认为你最好的答案应该在这里：

React：你可能不需要派生状态

如果你绝对必须，你可以尝试以下方法：

static getDerivedStateFromProps() 此方法将在每次渲染之前运行，包括第一次渲染。