Javascript 在反应和反应可拖动时设置状态问题

我对react中的setState函数有困难。我使用的是react Dragable软件包，我可以拖动我的div，但当我释放鼠标按钮时，它似乎没有设置x-y坐标，所以div只是快速恢复到原来的位置。有人能告诉我我在这里用OnControl Drag做了什么错事吗？谢谢

  export class DraggableAnswer extends React.Component {
  constructor(props, context) {
    super(props, context);

    this.controlledPosition ={ x: -25, y: 10};
  }
  onControlledDrag(e, position) {
    console.log(position);
    const {x, y} = position;
    this.setState({
      controlledPosition: {x: x, y: y}
    });
  }


  render() {
    const dragHandlers = {onStart: this.onStart, onStop: this.onStop};    

    return (
      <div className="draggableAnswerBlock">
            <Draggable
              zIndex={100}
              position={this.controlledPosition}
              {...dragHandlers}
              onDrag={this.onControlledDrag.bind(this)}>
                <div className="box">
                  Change my position
                </div>
            </Draggable>
      </div>
    )
  }
}

导出类DragableAnswer扩展React.Component{
构造函数（道具、上下文）{
超级（道具、背景）；
this.controlledPosition={x:-25，y:10}；
}
控制拖动（e，位置）{
控制台日志（位置）；
常数{x，y}=位置；
这是我的国家({
受控位置：{x:x，y:y}
});
}
render（）{
const dragHandlers={onStart:this.onStart，onStop:this.onStop}；
返回(
改变我的立场
)
}
}

在构造函数中，它应该是：

constructor(props, context) {
  super(props, context);

  this.state = { controlledPosition: { x: -25, y: 10} };
}

---

然后在返回中，您应该将this.state.controlledPosition传递到Draggable。现在，此.controlledPosition从未更新，因此在拖动完成后将重置

非常感谢，这让我明白了整个this.state和setState的关系是如何运作的！