это мое начальное состояние в authReducer.
const initialState = {
token:'',
isLogin: false,
error: {}
};
function AuthReducer(state = initialState, action) {
switch(action.type){
case AUTH_SUCCESS:
return sessionStorage.setItem('token',action.payload),{
...state,
isLogin: true,
token: action.payload,
error: {}
};
case AUTH_FAILED:
return {
...state,
isLogin: false,
token: '',
error: action.payload
};
default:
return state
}
}
export default AuthReducer;
это мой компонент входа, который работает нормально. пользователь может аутентифицироваться и все работает нормально:
class Login extends Component {
constructor(props){
super(props);
this.state ={
username: '',
password: ''
}
}
onSubmit = e => {
e.preventDefault();
this.props.login(this.state.username, this.state.password);
}
render() {
.....
)
}
}
const mapStateToProps = state => {
return {
get: { auth : state.AuthReducer}
}
}
const mapDispatchToProps = dispatch => {
return {
login: (username, password) => {
return dispatch(login(username, password));
}
};
}
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(Login));
и мой роутер выглядит примерно так:
class App extends Component {
constructor(props){
super(props)
}
render() {
let PrivateRoute = ({ component: ChildComponent, isLogin, ...rest}) => {
console.log({...rest}, "this is rest")
return <Route
{...rest}
render={props => {
if (!isLogin) {
return <Redirect to="/login" />;
} else {
return <ChildComponent {...props} />
}
}} />
}
return (
<div>
<Home />
<Switch>
<PrivateRoute path="/" exact isLogin={this.props.auth.isLogin} component={mainContent} />
<PrivateRoute path="/posts" isLogin={this.props.auth.isLogin} component={Posts} />
<Route path="/login" component={Login} />
</Switch>
</div>
);
}
}
const mapStateToProps = state => {
return {
auth: state.AuthReducer
}
}
const mapDispatchToProps = dispatch => {
return {
getUser: () => {
return dispatch(getUser());
}
};
}
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(App));
в реакции маршрутизатора, они сказали, что вы должны использовать с маршрутом от реакции-маршрутизатора-dom. моя проблема в том, логин работает нормально. но у меня нет доступа к моим реквизитам в моем privateroute , поэтому когда рендеринг отображает новую страницу, мой isLogin устанавливает значение false. У меня есть идея, что маршрутизатор не знает о моем избыточном или защищенных компонентах, не может знать об изменениях в props.all моего дочернего компонента в моем PrivateRoute связан с response-redux.sry об этом грязном коде.