Ref error

#react

React version:
16.8.6

Steps To Reproduce

import AUserList from '../AUserList';
class AUsers extends Component {

  constructor(props) {
    super(props);

    this.list = React.createRef();
    this.divTag = React.createRef();
  }
  handleChangeDataList = () => {
    console.log(this.list.current);//null
    console.log(this.divTag.current);//it works
   this.list.current.reloadAUserTable();//it is error
  }
  render() {
   return (
        <>
            <div className="animated fadeIn" ref={this.divTag}/>
            <AUserList ref={ref => this.list=ref}/>
            <Button  onClick={() => this.handleChangeDataList()}>atest</Button>
       </>
   )
  }
}
export default connect(mapStateToProps, mapDispatchToProps, null, {forwardRef : true})(AUsers);

class AUserList extends Component {
//from AUsers
  reloadAUserTable = () => {
    console.log('good');
  }
render() {
    const {
      AUserData_arr,
    } = this.props;
    return (
      <div>
        <Card>
          <CardBody>
            {AUserData_arr  &&
              <BootstrapTable data={AUserData_arr} version="4" striped hover pagination search tabIndexCell >

                <TableHeaderColumn dataField="UserLevel_Name" dataFormat={this.userLevelFormatter} dataSort>LEVEL</TableHeaderColumn>
              </BootstrapTable>
            }
          </CardBody>
        </Card>
      </div>
    );
  }