我在前端使用 Reactjs 并在后端使用 Laravel 开发了一个注册页面,我希望当我单击注册按钮时,它将被重定向到我的登录页面。
我的注册组件是:
handleSubmit = event => {
event.preventDefault();
const users = {
name:this.state.name,
email:this.state.email,
cin:this.state.cin,
phoneNumber:this.state.phoneNumber,
birthDate:this.birthDate,
password:this.state.password
}
console.log(users)
axios({
method: 'post',
url: 'http://172.16.234.24:8000/api/register',
data: users,
headers: {
'Access-Control-Allow-Origin': '*',
'Content-Type': 'application/json',
'Accept': 'application/json',
}
})
.then(function (response) {
console.log(response);
this.props.history.push('/login');
})
.catch(function (response) {
console.log(response);
});
}
我的路线是:
import React from "react";
import { Route, Switch, } from "react-router-dom";
import Home from "./Home";
import NotFound from "./NotFound";
import Login from "./Login";
import Signup from "./Signup";
export default () =>
<Switch>
<Route path="/" exact component={Home} />
<Route path="/login" exact component={Login} />
<Route path="/signup" exact component={Signup} />
<Route component={NotFound} />
</Switch>;
我的索引是:
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router } from "react-router-dom";
import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render(
<Router>
<App />
</Router>
, document.getElementById('root'));
serviceWorker.unregister();
我的 App.js 是:
import React, { Component } from 'react';
import { Link } from 'react-router-dom';
import { Nav, Navbar, NavItem } from "react-bootstrap";
import { LinkContainer } from "react-router-bootstrap";
import Routes from "./Routes";
import './App.css';
class App extends Component {
render() {
return (
<div className="App container">
<Navbar fluid collapseOnSelect>
<Navbar.Header>
<Navbar.Brand>
<Link to="/">Home</Link>
</Navbar.Brand>
<Navbar.Toggle />
</Navbar.Header>
<Navbar.Collapse>
<Nav pullRight>
<LinkContainer to="/signup">
<NavItem>Signup</NavItem>
</LinkContainer>
<LinkContainer to="/login">
<NavItem>Login</NavItem>
</LinkContainer>
</Nav>
</Navbar.Collapse>
</Navbar>
<Routes />
</div>
);
}}
export default App;
我的react-router-dom版本是4.3.1,当我运行时我得到:
typeerror: cannot read property 'props' of undefined
我该如何解决这个问题?