引用子组件

时间:2019-04-23 01:21:41

标签: reactjs ref

我无法使用ref访问孩子的功能。 如果我尝试检查this.child.current,则列出孩子的props

class BottomPanel extends React.Component<Props, {}> {
  constructor(props) {
    super(props);
    this.child = React.createRef();
    this.onClick = this.onClick.bind(this);
  }

  onClick() {
    this.child.current.getAlert();
  }

  render() {
    <div>
      <BottomPanelPeriodList ref={this.child}>
        <div label={<FormattedMessage id="bottomPanel.threeMonth" />} />
        <div label={<FormattedMessage id="bottomPanel.sixMonth" />} />
      </BottomPanelPeriodList>
    </div>
  }
}
export default connect(mapStateToProps)(BottomPanel);

class BottomPanelPeriodList extends React.Component<Props, State> {
  getAlert = () => {
    alert('HELLOWORLD!');
  };

  render() {
    ...
  }
}
export default connect(null, mapDispatchToProps, null, { forwardRef: true })(BottomPanelPeriodList);

1 个答案:

答案 0 :(得分:0)

render() {
 retuun(  <div>
  <BottomPanelPeriodList ref={this.child}>
    <div label={<FormattedMessage id="bottomPanel.threeMonth" />} />
    <div label={<FormattedMessage id="bottomPanel.sixMonth" />} />
  </BottomPanelPeriodList>
</div>)
}

进行更改并引用此链接 https://repl.it/@KishanJaiswal/HungryAustereRelationalmodel

相关问题