javascript - Reactjs将变量传递给另一个类的函数

Request.js

export default class Request extends React.Component {
getForm(e) {
  let v = validator(document.getElementById('myinput')); // here is should call function from another class
}
render(){
  return(
      <form onSubmit={this.getForm.bind(this)}>
        <RequestValidator/> // here is I called second class
        <Input id="myinput" value="65"/>
      </form>
    }
  }
}

RequestValidator.js

export default class RequestValidator extends React.Component {
  validator = (e) => { // here is the target function
    console.log(e.value);
  }
}

我想做的是，将#myinput组件类中的变量（Request值）传递给另一个组件类（validator）中的函数（RequestValidator）。

到目前为止，我所做的是上面的代码，但是出现错误：


  未定义'验证器'no-undef

最佳答案

您可以使用ref来完成。您在父组件中创建一个：

class Request extends React.Component {
    constructor(props) {
        super(props)
        this.requestValidatorRef = React.createRef();
    }

然后将其传递给子组件：

<RequestValidator ref={this.requestValidatorRef} />

在这一点上，您应该能够像这样调用您的方法：

getForm(e) {
  this.requestValidatorRef.current.validator(e) // ...
}