触发drop事件时，Set state无效

import React, { Component } from 'react';

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      dragOver: false
    };
  }

  componentDidMount() {
    // 添加dragover和drop事件监听器
    document.addEventListener('dragover', this.handleDragOver);
    document.addEventListener('drop', this.handleDrop);
  }

  componentWillUnmount() {
    // 移除dragover和drop事件监听器
    document.removeEventListener('dragover', this.handleDragOver);
    document.removeEventListener('drop', this.handleDrop);
  }

  handleDragOver = (event) => {
    event.preventDefault();
    this.setState({ dragOver: true });
  }

  handleDrop = (event) => {
    event.preventDefault();
    // 其他操作，例如获取拖放的数据
    // ...

    // 更新组件状态
    this.setState({ dragOver: false });
  }

  componentDidUpdate(prevProps, prevState) {
    if (prevState.dragOver !== this.state.dragOver && this.state.dragOver) {
      // 在这里进行setState的操作
      // ...
    }
  }

  render() {
    return (
      <div>
        {/* 添加需要接受拖放的元素 */}
        <div onDragOver={this.handleDragOver} onDrop={this.handleDrop}>
          {/* 其他组件内容 */}
        </div>
      </div>
    );
  }
}

export default MyComponent;