在 ReactJS 中单击按钮时如何获取父 div 的键属性？

在 ReactJS 中获取父 div 的键属性可以使用 refs 属性来实现。refs 属性能够提供一个不透明的引用，并且可以在 React 组件中直接访问 DOM 元素或组件实例。在此基础上，我们可以使用 refs 从子组件中访问父组件。

我们可以在父组件的构造函数中创建一个 ref，并将其传递给子组件。子组件可以通过方法调用 this.props.<ref> 来访问父组件。在此基础上，我们可以使用 this.props.<ref>.getAttribute('key') 来获取父 div 的键属性。

以下是一个示例代码片段：

class ParentComponent extends React.Component {
  constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }

  render() {
    return (
      <div key="parentDiv" ref={this.myRef}>
        <ChildComponent parentRef={this.myRef} />
      </div>
    );
  }
}

class ChildComponent extends React.Component {
  onClickHandler = () => {
    const parent = this.props.parentRef.current;
    const key = parent.getAttribute('key');
    console.log(key);
  };

  render() {
    return <button onClick={this.onClickHandler}>Get parent key</button>;
  }
}

在这个示例中，ParentComponent 创建了一个 ref 并将其传递给 ChildComponent。ChildComponent 通过 onClickHandler 方法访问 ParentComponent 并获取其键属性。在单击按钮时，控制台将打印出 parentDiv（父 div 的键属性）。