Javascript 如何更新样式坐标

每当我尝试在react中动态更新某些组件时，例如，mousemove上对象的位置，它都会抛出一个错误：

Warning: `div` was passed a style object that has previously been mutated. Mutating `style` is deprecated. Consider cloning it beforehand.

如果我无法以任何方式更新对象样式的道具，那么如何才能在react中执行任何类型的动态操作，如交互式游戏。至于Reactjs建议的克隆节点，没有解释如何通过克隆元素获得相同的结果

这一点帮助都没有

我的问题是，在mouseup事件中（用户想要删除该片段），我想更新样式道具，以获得来自更新状态属性的新值，即在渲染函数中

<ComponentOne style={{left: this.state.left, top: this.state.top}} />  

---

之所以发出此警告，是因为

左侧

或

顶部

为

NaN

。在

getInitialState函数中，将左侧或顶部初始化为零或某个值

  getInitialState: function() {
    return {
      left:0,
      top: 0
    };

同样，克隆React元素在这里也帮不了你。警告是指在对样式对象进行更改时必须克隆该对象。可以这样做

var style1 = {myProp: "value"};
var style2 = Object.assign({}, style1, {newProp:"newValue"}); 

而不是直接将它们设置为

<ComponentOne style={{left: this.state.left, top: this.state.top}} /> 



这样做

var myStyle = {left: this.state.left, top: this.state.top};
<ComponentOne style={myStyle} /> 

var myStyle={left:this.state.left，top:this.state.top}；

然后根据您的更改克隆您的myStyle对象，并将更改后的样式属性添加到其中。
这个答案为我做到了：