Не удается получить обновленное состояние от редуктора - PullRequest
Новая
       9

Не удается получить обновленное состояние от редуктора

0 голосов
/ 02 декабря 2018

Я сделал функцию входа, которая обновляет state в моем reducer с false до true.Я проверяю это в моем reducer и моей функции входа в систему.Но когда я хочу проверить состояние в другом файле, он продолжает возвращать false.

Моя функция входа в систему: 

axios
    .post('api/user/login', {
        username: this.state.username,
        password: this.state.password
    })
    .then(response => {
        return response;
    })
    .then(json => {
        if (json.data.success) {
            store.dispatch(loginStatus(true));
            console.log('Login: ' + store.getState().loggedIn);
            window.location.assign('/');
        } else {
            alert('Login Failed!');
        }
    })
    .catch(error => {
        alert('An Error Occured!' + error);
        console.log(error);
    });

, которая возвращает true

Мой редуктор: 

import { LOGIN_STATUS } from "../constants/action-types";

const initialState = {
    loggedIn: false
};

const rootReducer = (state = initialState, action) => {
    switch (action.type)  {
        case LOGIN_STATUS:
            state.loggedIn=action.payload;
            console.log('Reducer: ' + state.loggedIn);
            return {
                loggedIn: state.loggedIn=action.payload
            };
        default:
            return state;
    }
};

export default rootReducer;

Что также возвращает true

Но затем в моем другом файле: 

import React from 'react';
import { Redirect, Route } from 'react-router-dom';
import  store from '../store/index';

const privateRouter = ({component: Component, ...rest }) => {

    const isLoggedIn = store.getState().loggedIn;
    console.log('PrivateRoute: ' + isLoggedIn);

    return (
        <Route
            {...rest}
            render={props =>
            isLoggedIn ? (
                <Component {...props} />
            ) : (
                <Redirect to={{ pathname: '/login', state: { from: props.location } }} />
            )}
        />
    )
};

export default privateRouter;

возвращается false.Я делаю что-то не так с получением государства?Потому что в моей функции входа он возвращает обновленное состояние.

Обновление:

Кстати, это мой роутер: 

   <Provider store={store}>
        <Router>
            <Switch>
                <Route path={'/login'} component={Login}/>
                <Route path={'/register'} component={Register}/>
                <PrivateRoute path={'/'} component={Home}/>
            </Switch>
        </Router>
    </Provider>

1 Ответ

0 голосов
/ 02 декабря 2018

Кажется, ваша функция "privateRouter" не сработает, как только редуктор изменит состояние.Вам нужно вызвать функцию privateRouter, чтобы получить последний магазин.Вместо того, чтобы импортировать хранилище, используйте «Провайдер» и «Соединить» для передачи состояния компонентам.

https://www.sohamkamani.com/blog/2017/03/31/react-redux-connect-explained/

...