Question

我有一个如下所示的React组件。此组件在其他地方与ref一起使用。我有办法通过myMethod来呼叫ref吗？

class MyView extends Component {
  myMethod() {

  }

  render() {
    return (
      <View style={{flex: 1}}>
        {this.props.children}
      </View>
    )
  }
}

export default connect((state) => ({
    reduxState: state
  })
)(MyView)

Answer 1

是的，这是可能的。使用像

这样的连接创建容器组件

export default connect((state) => ({
    reduxState: state
  }), null, null, { withRef: true }
)

请查看此处的connect文档

https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options

简而言之（来自文档）：[withRef]（Boolean）：如果为true，则将ref存储到包装的组件实例，并通过getWrappedInstance（）方法使其可用。

现在为了使用组件引用myMethod

componentDidMount () {
  this.refs.component.getWrappedInstance().myMethod();
}

render() {
  return (
    <MyView ref="component" />
  )
}

Answer 2

你可以这样做：

componentDidMount() {
   this._myViewInstance.myMethod();
}

render() {
    return (
        <div><MyView ref={ref => this._myViewInstance = ref}/></div>
    )
}

React：通过ref调用组件方法

2 个答案: