如何使用getInitialState()
中的状态重新呈现组件?
例如:https://jsbin.com/pajapoyipo/edit?html,output
在示例代码中我单击按钮,组件按钮更改状态和按钮为黄色 - 它的工作,但是当我点击另一个按钮时我想点击按钮是黄色(它的工作),并且旧按钮已更改状态和颜色为红色(不起作用)。
答案 0 :(得分:4)
避免这样的事情:
childState.setState({klasa: "yellow"});
您不应该从父级设置子状态。状态是组件的内部,它应该只能自行更改。相反,父母可以使用不同的道具重新渲染孩子。
如果您只想激活一个按钮,那么您必须拥有一些只允许一个活动按钮的状态。由于孩子们不能了解他们的兄弟姐妹,所以这片州必须住在父母身边。我称之为activeBtn
。如果activeBtn
为1,则第一个按钮显示为黄色。父级中的这段状态对应于子级中的布尔属性active
。我还在父级中定义了一个单击处理程序来更改状态。此单击处理程序作为prop传递给每个子项。
如果这没有意义,修改后的代码应作为更好的解释: https://jsbin.com/filasisemu/1/edit?html,output