有几个问题。

1）你必须绑定 passingProps

constructor(){
    super();
    this.state={
      text:''
    }
    this.passingProps = this.passingProps.bind(this);
}

2)this.setState是异步的，因此不能保证this.state.text在您将其传递给this.props.getInput. 你可以做

this.props.getInput(newInput)

或者

this.setState({ text: newInput }, () => {
  this.props.getInput(this.state.text);
})

来解决这个问题。

class App extends React.Component{
constructor(props){
  super(props);
  this.state={
    input:'this is the input for now'
  }
  this.handleInput=this.handleInput.bind(this);   
}

handleInput(event){
  let value = event.target.value;
  this.setState({
    input:value
  });
}

render(){
   return(
     <div>
       <h1>{this.state.input}</h1>
       <Child getInput={this.handleInput} />
     </div>
   );
  }
}

 class Child extends React.Component{
   constructor(){
      super(props);
}

render(){
   return(
     <div>
     <input type="text" placeholder="please input a name..." onChange={this.props.getInput} />
    </div>

     )
   }
}

ReactDOM.render(
  <App/>,
  document.getElementById('app')
);

这是您的问题的答案。我希望你的问题得到解决。

在您的Child组件中，您编写了以下代码：

passingProps(e){
  var newInput=e.target.value;
  //alert(newInput);
  this.setState({
     text:newInput
  });
  this.props.getInput(this.state.text);
}

该问题是由于setState 函数的异步行为造成的。这意味着你不能在一行上调用 setState 并期望它在下一行更新。使用 setState 的回调函数调用父组件的函数就像这样：

passingProps(e){
  var newInput=e.target.value;
  //alert(newInput);
  this.setState({ text: newInput }, () => {
     this.props.getInput(this.state.text);
  })
}

同样的事情发生在App 组件的handleInput函数中。

this不会自动绑定到您的传递props函数中。尝试使用箭头函数语法来绑定它。

passingProps = e => {
  var newInput=e.target.value;
  //alert(newInput);
  this.setState({
    text:newInput
  });
  this.props.getInput(this.state.text);
}

你需要纠正它的两件事：

1. 如果要访问新状态，则不要使用this.state.inputafter this.setState({input: 'xxx'})。这就是为什么不这样做的原因。
2. this.passingProps = this.passingProps.bind(this)定义了什么this是当前范围。this在组件的函数中使用时，this需要绑定。

更改密码笔