javascript - 我正在尝试使用 ref 在反应中访问模态（mui 模态）内的元素，但对元素的引用为空

Question

我试图在组件中访问确实挂载生命周期方法，但它显示为空。如果我删除模态，它会按预期工作，但模态引用内部不能正常工作。谢谢。我试过关注，但它总是显示为空。

import React, { Component } from "react";
import {
  Modal,
  Backdrop,
  Fade,
  Container
} from "@material-ui/core";
import { contactUsFormSchema } from "../../constant/FormValidation";

class ContactUs extends Component {
  constructor(props) {
    super(props);
    this.state = {

    };
    this.rootRef = React.createRef();
    this.childRef = React.createRef();
    this.observer = new IntersectionObserver((entries)=>{
      console.log(entries[0]);
    },{
      root:this.rootRef.current
    });
  }

  componentDidMount(){
    console.log(this.childRef.current); // this is always null
    console.log(this.rootRef.current); // this is always null
    // this.observer.observe(this.childRef.current);
  }

  render() {
    const { classes } = this.props;
    return (
      <Modal
        open={true}
        onClose={this.props.handleClose}
        closeAfterTransition
        BackdropComponent={Backdrop}
        BackdropProps={{
          timeout: 500
        }}

      >
          <Container className={classes.modalStyle}  ref={this.rootRef}>
            <div className={classes.title} ref={this.childRef} >Contact US</div>
          </Container>
      </Modal>
    );
  }
}

export default ContactUs;