Question

我已经读过，从道具设置状态是一种反模式，但是从州设置子属性呢？这段代码是否可以，或者是否有更好的做法。

我们假设我们有一个APP组件来保存和更改它的状态。将该状态作为道具传递给子显示组件是不错的做法？

   var APP = React.createClass({

   getInitialState() {
       return {
           items: [1,2,3],
           title: 'Simple Sample'
       };
   },

   render() {
       return <div>
           <Display title={this.state.title} />
           <List items={this.state.items} />
       </div>
   }
});

这样的事情：

   var APP = React.createClass({

   getInitialState() {
       return {
           items: [1,2,3],
           title: 'Simple Sample'
       };
   },

   render() {
       return <div>
           <DisplayList {...this.state} />
       </div>
   }
});

Answer 1

将父母的state传递给孩子的props是与孩子沟通的主要方式。将函数引用传递给子props是允许孩子与父母交流的主要方式。

我个人避免使用<DisplayList {...this.state} />模式，因为我更喜欢明确DisplayList的API以及需要传递哪些道具。当你稍后添加另一个变量时，传递整个状态会导致细微的错误。

你提到的反模式是可能采取组件的props并将它们复制到同一组件的state的模式 - 然后变得更难以找出谁拥有数据，以及是否应拨打setState或在this.props上调用某种方法。

React ...从State设置子属性

1 个答案: