Node.js React中从父级到子级的回调函数

我有一个父

应用程序

和一个子组件

登录

。在

Login

组件中，用户可以正确登录，我可以将用户详细信息存储在

setState

中。但是我想通过名为

userState

的回调函数将此状态传递给父级

App

这是父级

应用程序
：

const { BrowserRouter, Link, Switch, Route, browserHistory } = ReactRouterDOM;

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      currentUser: ""
    }
  }
  userState = (user) => {
    this.setState = {
      currentUser: user
    }
  }
  render() {
    return (
      <BrowserRouter>
        <div>
          <Nav />
          <Switch>
            <Route exact path="/someroute1">
              <Someroute1 />
            </Route>
            <Route path="/login">
              <Login userState={this.userState} currentUser={this.state.currentUser} />
            </Route>
            <Route path="/route2">
              <Someroute2 />
            </Route>
          </Switch>
          <Footer />
        </div>
      </BrowserRouter>
    );
  }
}

ReactDOM.render(<App />, document.querySelector(".container"));


我已经阅读了本教程，并从stackoverflow中找到了很多答案，但不知何故，我的回调函数什么都没做

感谢您的帮助
 这是您收到的错误

首先，家长JS看起来很棒

在childJS中有一些问题，它们从这里开始：

    this.state = {
    ...  
    currentUser: this.props.currentUser
}

大概它们会一直延伸到组件的其余部分（即显示用户所看到的内容的位置）

您需要做的是保持数据流的一致性。ChildJS不需要状态，它只需要显示父状态（由道具传递）

ParentJS（状态：用户，设置状态）=>

子JS将是：render（）{return（{currentUser}}）
用say这可能会帮助你


母公司

从“../Child.js”导入子项；
类父级扩展组件{
getValue=（数据）=>{
//登录数据
控制台日志（数据）；
}
render（）{
返回(
)
}
}

孩子

类子级扩展组件{
onLogin=（）=>{
this.props.getValue（'anydata to parent here'）；
}
render（）{
返回(
这个.onLogin}>Login
)
}
}
对您有帮助吗？在父组件中的
userState
方法中，您不应该为
this.setState
赋值，而是使用
this.setState
作为设置状态的方法：
this.setState（{currentUser:user}）
。有关
setState
方法的详细信息。
    this.state = {
    ...  
    currentUser: this.props.currentUser
}

import Child from '../child.js';

class Parent extends Component {

 getValue = (data) =>{
  //Login data
  console.log(data);
 }

 render(){
  return(
   <div>
    <Child getValue={this.getValue} />
   </div>
  )
 }
}

 class Child extends Component {

 onLogin = () =>{
  this.props.getValue('any data to parent here');
 }

 render(){
  return(
   <div>
    <button onClick={()=>this.onLogin}>Login</button>
   </div>
  )
 }
}