我正在尝试渲染几个反应元素,这些元素依赖于其他反应元素的x和y坐标。我知道我必须更新'componentDidUpdate'方法中的元素,因为在呈现组件之前我无法获取值。
当前行为没有任何更新。 renderNew包含我要渲染的react元素,但是它没有更新,因为什么也没有显示。
我不是在状态中存储值,我认为我不需要这样做。
在这里设置状态和其他变量
constructor(props) {
super(props);
this.state = {
priceDataData: jsonOrders.order.map(order => order.total),
heightData: '',
xElements: '',
yElements: '',
dotsWeWant: ''
};
this.dimensionsX = [];
this.dimensionsY = [];
this.renderNew = [];
this.dotRef = [];
}
这是我的componentDidUpdate方法
componentDidUpdate = () => {
const nodeRefs = this.dotRef;
this.dimensionsX = this.connectTheDotsX(nodeRefs);
this.dimensionsY = this.connectTheDotsY(nodeRefs);
this.renderNew = this.renderNewLines(this.dimensionsX,
this.dimensionsY, this.state.priceDataData, this.state.dotsWeWant);
}
}
我的JSX的代码段,其中包含未更新的变量。第一次渲染时它将为空,需要更新。
<div className="graph_space">
<div className="dot_container">
{this.state.dotsWeWant}
</div>
<div className="test_stuff">
{this.renderNew}
</div>
</div>