在reactjs中从父级调用子函数答案

【问题标题】：call child function from parent in reactjs在reactjs中从父级调用子函数
【发布时间】：2019-02-07 01:46:34
【问题描述】：

我的父组件

import EditReview from './partials/editReview'

class VenueDetails extends Component {
  constructor(props) {
    super(props)
    this.child = React.createRef();
  }
  render() {
    return (
      <div className="place-review-text">
        <EditReview {...this.props}/>
      </div>
    )
  }
}

我的子组件

class EditReview extends Component {
  onEditClick(review, editIndex) {
    console.log('ppp')
  }

  render() {
    const { handleSubmit, user, pristine, index, commentCrossClick } = this.props
    return (
      <div>
        <Field
          name="content"
          component={renderTextArea}
          className="form-control"
          label="Write your review..."
          rows={2}
        />
      </div>
    )
  }
}

export default EditReview

我需要从父组件调用onEditClick。我试过this，但没有用。

请帮帮我

编辑

升级后我得到了这个

Error in ./~/react-dom/lib/ReactServerRendering.js
Module not found: 'react/lib/React' in /home/user/ashish/LTC/lovethesecities-frontend/node_modules/react-dom/lib

解决所有错误后call child function from parent in react 16

【问题讨论】：

标签： javascript reactjs react-component

【解决方案1】：

尝试这样做：

import EditReview from './partials/editReview'

class VenueDetails extends Component {
  render() {
    return (
      <div className="place-review-text">
        <EditReview ref={Ref => this.child=Ref } {...this.props} />
      </div>
    )
  }
}

并将父组件中的函数调用为this.child.onEditClick(param1,param2)

EDIT1：

如果你必须用 react 15.x 本身来做，你可以做的是在父级中创建函数并将其作为道具传递给子级

【讨论】：

为什么不在父级中创建该函数并将其作为似乎是唯一选择的道具传递给子级...
是的，但是 onClick 处理程序在父组件中...好的，请稍候我正在升级

【解决方案2】：

React 文档有一个使用 refs 的示例

https://reactjs.org/docs/refs-and-the-dom.html

我也想知道想要这样做的用例，也许一些上下文可以帮助回答？

【讨论】：