一旦子组件在注册中成功,我如何让父组件路由到主页?

How can I have parent component to route to home page once child component has a success in Signup?

如果子组件 LoginApp 有响应,我希望我的父组件 App.js 路由到 '/home'。 (所有验证都发生在服务器端,因此只有在验证成功时才会返回响应)。

// Child Component

 const LoginApp = () => {
  const signupWasClickedCallback = (data) => {
console.log(data);


// ----- Adding Favourites
axios.post('/api/account/signup', data)
  .then(function (res) {
    console.log(res);

  })
  .catch(function (err) {
    console.log(err);
  });

 };
    const loginWasClickedCallback = (data) => {
   console.log(data);

axios.post('/api/account/signin', data)
  .then(function (res) {
    console.log(res);
  })
  .catch(function (err) {
    console.log(err);
  });
  };

return (
<div className="loginWrapper">
  <ReactSignupLoginComponent
    title="Welcome to KidKlub!"
    handleSignup={signupWasClickedCallback}
    handleLogin={loginWasClickedCallback}
  />
</div>
);


  };


export default LoginApp;




  // Parent Component

  class App extends Component {
   render() {
     return (
    <Router>
    <div>
      <Route exact path="/" component={LoginApp} />
      <Route exact path="/home" component={Home} />
    </div>
  </Router>
      );
       }
  }

 export default App;

你可以这样做:

.then(function (res) {
console.log(res);
props.history.push('/home');
})
.catch(function (err) {
console.log(err);
props.history.push('/');
});

使用 react-router 中的 withRouter-dom

import { withRouter } from 'react-router-dom';

用 withRouter 包裹你的组件

export default withRouter(LoginApp);