У меня есть страница входа с HOC. Я передаю компонент, который должен отображаться после успешного входа.
Здесь, если я проверяю isLoggedIn и перенаправляю при рендеринге sigin-in, то я получаю ошибку
err: нарушение инварианта: превышена максимальная глубина обновления. Это может произойти, когда компонент повторно вызывает setState внутри componentWillUpdate или componentDidUpdate. React ограничивает количество вложенных обновлений для предотвращения бесконечных циклов
saga.js
try{//call api
//put login success
<Redirect to="/app"/>
}
index.js
const AuthProfile=requireAuth(App);
In reactdom
<Route render={(props)=><AuthProfile {...props}/>} path="/app"/>
import React, { PropTypes } from 'react';
import { connect } from 'react-redux';
import { push } from 'react-router-redux';
import { bindActionCreators } from 'redux';
export default function (ComposedComponent) {
class Authenticate extends React.Component {
componentDidMount() {
console.log("12ra")
this._checkAndRedirect();
}
componentDidUpdate() {
this._checkAndRedirect();
}
_checkAndRedirect() {
const { isLoggedIn, redirect } = this.props;
if (!isLoggedIn) {
redirect();
}
}
render() {
console.log("28ra")
return (
<div>
{ this.props.isLoggedIn ? <ComposedComponent {...this.props} /> : null }
</div>
);
}
}
const mapStateToProps = (state) => {
return {
isLoggedIn:state.signInReducer.isLoggedIn
};
};
const mapDispatchToProps = dispatch => bindActionCreators({
redirect: () => push('/')
}, dispatch)
//Authenticate.propTypes = propTypes
return connect(
mapStateToProps,
mapDispatchToProps
)(Authenticate);
}
Правильно ли задан компонент HOC или я что-то упустил?
Это хорошая практика для перенаправления в саге?
Может кто-нибудь, пожалуйста, дайте мне знать, как мне добраться до компонента приложения после успеха, я застрял там, пожалуйста, помогите спасибо
UPDATE
saga.js
yield put({type:LOGIN_SUCCESS,payload:data})
yield put(push('/app'))
index.js
Ex для Page1, Page2 Мне нужно
<AuthRoute
exact
path="/"
component={Page1}
redirectTo="/login"
authenticated={this.props.isLoggegIn}
/>
<AuthRoute
exact
path="/"
component={Page2}
redirectTo="/login"
authenticated={this.props.isLoggegIn}
/>