У меня следующий код
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Route, Switch } from 'react-router';
import { BrowserRouter } from 'react-router-dom';
import Auth from './component/AuthForm';
ReactDOM.render(
<BrowserRouter>
<Switch>
<Route path='/' component={Auth} />
</Switch>
</BrowserRouter>,
document.getElementById('content')
);
Но почему-то я раньше не получал данную проблему, а сейчас у меня ничего не рендерится страница, в чем может быть дело?
в Auth
import React from 'react';
import ReactDOM from 'react-dom';
import TextField from 'material-ui/TextField';
import RaiseButtin from 'material-ui/RaisedButton';
import Helmet from '../aplication';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import injectTapEventPlugin from 'react-tap-event-plugin';
import axios from 'axios';
injectTapEventPlugin();
class UserForm extends React.Component{
state = {
login: "",
password: "",
error: ""
};
handleSubmit = e => {
e.preventDefault();
axios.post('/api/user', this.state)
.then(response => {
if (response.data === false){
this.setState({ error: 'Неверный логин или пароль'});
} else {
console.log(response.data);
}
})
.catch(err => console.log(err));
};
handleChange = e => {
const { name, value } = e.target;
this.setState({
[name]: value,
});
};
render(){
const { login, password, error } = this.state;
return(
<div className='authForm'>
<Helmet title='Авторизация'/>
<h1>Авторизация</h1>
<div className='error'>{error}</div>
<form onSubmit={this.handleSubmit}>
<MuiThemeProvider>
<TextField
hintText="Введите логин"
name="login"
fullWidth={true}
value={login}
required={true}
onChange={this.handleChange}
/>
</MuiThemeProvider>
<MuiThemeProvider>
<TextField
hintText="Введите пароль"
type="password"
name="password"
fullWidth={true}
value={password}
required={true}
onChange={this.handleChange}
/>
</MuiThemeProvider>
<MuiThemeProvider>
<RaiseButtin label="Войти" fullWidth={true} className="authForm-button"> <input type="submit" className="authForm-input" /> </RaiseButtin>
</MuiThemeProvider>
</form>
</div>
);
}
}
ReactDOM.render(
<UserForm />,
document.getElementById('content')
);