При переходе на /admin не работает this.props.history.push('/admin/signIn'). Когда ввожу роут в ручную, всё отлично переходит. А когда ввожу /admin, вместо редиректа получаю ошибку:
Полагаю, что всё из-за этого ворнинга, но исправить его не удаётся
src/index.js
import SignUp from './components/SignUp';
import SignIn from './components/SignIn';
import Admin from './components/Admin';
import Main from './components/Main';
import Reducers from './reducers';
import authGuard from './components/HOCs/authGuard';
const jwt = localStorage.getItem('JWT');
axios.defaults.headers.common['Authorization'] = jwt;
ReactDOM.render(
<Provider store = {createStore(Reducers, {
auth: {
token: jwt,
isAuthenticated: jwt ? true : false
}
}, applyMiddleware(reduxThunk))}>
<BrowserRouter>
<App>
<Route exact path = '/' component = { Main } />
<Route exact path = '/admin' component = { authGuard(Admin) } />
<Route exact path = '/admin/signIn' component = { SignIn } />
<Route exact path = '/signUp' component = { SignUp } />
</App>
</BrowserRouter>
</Provider>,
document.querySelector('#root'))
serviceWorker.unregister();
authGuard.js:
import React, { Component } from 'react';
import { connect } from 'react-redux';
export default (OriginalComponent) => {
class MixedComponent extends Component {
checkAuth() {
if(!this.props.isAuth && !this.props.jwt) {
console.log(this.props.history)
this.props.history.push('/admin/signIn'); //а вот и он
}
}
componentDidMount() {
this.checkAuth();
}
componentDidUpdate() {
this.checkAuth();
}
render() {
return <OriginalComponent {...this.props}/>;
}
}
function mapStateToProps(state) {
return {
isAuth: state.auth.isAuthenticated,
jwt: state.auth.token
}
}
return connect(mapStateToProps)(MixedComponent);
}
component/Admin.js:
class Admin extends Component {
constructor(props) {
super(props);
this.state = {
}
}
render() {
const { handleSubmit } = this.props;
return(<div></div>);
}
}
function mapStateToProps(state) {
return state;
}
export default compose(
connect(mapStateToProps, actions),
reduxForm({form: 'admin'})
)(Admin);
Надо передать роутеру объект browserHistory в src/index.js
...
import {createBrowserHistory} from 'history';
...
const browserHistory = createBrowserHistory();
...
<BrowserRouter
history={browserHistory}
>
...
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Есть ссылка, и внутри ссылки текстКак сделать так, чтобы при клике на спан ссылка не открывалась, а выполнялась JS-функция?
Объясните чем отличаются две структуры и какую лучше использовать в проектах?
Как сделать, чтобы при нажатии на ссылку в браузере открывалось приложение ЯндексКарты, с местом навигации (координаты)?