Question

这是一个模糊的问题，但让我尝试通过伪代码。如果我在父对象中创建一个子对象数组：

class Parent extends React.Component {
    constructor() {
        this.state = {kids: [<Child/>,<Child/>]};
    }
    render () {
        return <div>{this.state.kids[0]}{this.state.kids[1]}</div>
    }
}
class Child extends React.Component {
...
}

如果我在Child组件中的Child上执行setState，是否应该更改父子数组？我的想法是那个数组的元素是孩子，所以改变一个孩子应该改变元素。我理解错了吗？

Answer 1

除非您在触发父级的子级更新时发生特定回调，否则父级将不会获得该更新。

这就是为什么大多数React开发人员采用了一种智能和愚蠢的组件模式：你真的不应该在两个组件中管理子项的状态。父组件应该提供回调函数作为子组件的道具，这些子组件处理将应用于该子组的任何类型的更改，然后相应地更新其自己的状态，一旦其状态更新，它将把必要的部分传递给每个子组件作为道具。

您的目标应该是在组件中分布最少的状态，并尝试将状态保持在一个组件中，其余的只是接收道具。关于此的一篇好文章是：http://jaketrent.com/post/smart-dumb-components-react/

子数组 - 状态不更新

1 个答案: