传递react本机中元素的位置

// 父组件
import React from 'react';
import ChildComponent from './ChildComponent';

class ParentComponent extends React.Component {
  render() {
    const position = { x: 100, y: 200 }; // 假设位置信息为{x: 100, y: 200}

    return (
      <div>
        <ChildComponent position={position} />
      </div>
    );
  }
}

// 子组件
import React from 'react';

class ChildComponent extends React.Component {
  render() {
    const { position } = this.props; // 获取位置信息

    // 在这里使用位置信息进行相应的处理

    return (
      <div>
        {/* 子组件的内容 */}
      </div>
    );
  }
}

// 父组件
import React from 'react';
import ChildComponent from './ChildComponent';

class ParentComponent extends React.Component {
  handlePositionChange = (position) => {
    // 在这里使用位置信息进行相应的处理
  }

  render() {
    const position = { x: 100, y: 200 }; // 假设位置信息为{x: 100, y: 200}

    return (
      <div>
        <ChildComponent onPositionChange={this.handlePositionChange} />
      </div>
    );
  }
}

// 子组件
import React from 'react';

class ChildComponent extends React.Component {
  componentDidMount() {
    const { onPositionChange } = this.props;

    const newPosition = { x: 300, y: 400 }; // 假设新的位置信息为{x: 300, y: 400}
    onPositionChange(newPosition); // 调用回调函数并传递新的位置信息
  }

  render() {
    return (
      <div>
        {/* 子组件的内容 */}
      </div>
    );
  }
}