Question

我在react中创建了一个自定义树面板。每次更新选择的treeNode（状态）。现在，当我在孩子上选择时，我想更改根的颜色。我想用refs做到，为所有TreeNode添加它，然后在React中使用DOM操作获得它（据我所知是ReactDom.finddomnode）我有2个组件Tree和TreeNode Tree的代码部分

Tree.js
    <TreeNode ref={(el) => this.treeRef = el}

事件单击是TreeNode组件中的句柄。现在，我想赶上这个事件并更新我的根目录。使用ReactDom.findDomNode时出现错误。任何想法

Answer 1

您应该使用状态来显示根的颜色。使用ref然后操纵DOM节点完成如此简单的任务将破坏React的目的。引用在特殊情况下使用，可以使用状态/属性来完成。

我不知道您对Tree的实现，但是例如，您可以执行以下操作：

render() {
    return <div style={{backgroundColor:this.state.bgColor}}> 
    </div> 
}

changeBGColor(color) {
   this.setState({bgColor:color})

}

现在，您可以将changeBGColor方法传递给child，然后可以调用child进行适当的颜色更改。由于我对您的实施情况了解有限，因此无法为您提供确切的解决方案，但希望对您有所帮助。

反应树父节点更新

1 个答案: