Состояние меняется на неопределенное значение. Я использую Redux-инструментарий с Redux-Persist - PullRequest
Новая
       33

Состояние меняется на неопределенное значение. Я использую Redux-инструментарий с Redux-Persist

0 голосов
/ 29 апреля 2020

Я пытаюсь изменить свое состояние в редукторе login , но после операции state.user = data.user, console.log печатает undefined .

My authSlice : 

import { createSlice } from '@reduxjs/toolkit';
import api from '../../config/api';

const authSlice = createSlice({
  name: 'auth',
  initialState: {
    user: null,
    token: '',
  },
  reducers: {
    async register(state, action) {
      console.log(action);
      await api
        .post('users', action.payload)
        .then(({ data }) => {
          state = data.data;
          console.log(state);
        })
        .catch((err) => {
          console.log(err);
        });
    },
    async login(state, action) {
      try {
        const { data } = await api.post('sessions', action.payload);
        console.log(state);
        state.user = data.user;
        console.log(state);
        state.token = data.token;
      } catch (err) {
        console.log(err.response && err.response.data.error);
      }
    },
  },
});

const { actions, reducer } = authSlice;

export const { register, login } = actions;
export default reducer;

Мой магазин: 

import {
   configureStore,
   combineReducers,
   getDefaultMiddleware,
 } from '@reduxjs/toolkit';
 import { AsyncStorage } from 'react-native';
 import {
   persistReducer,
   persistStore,
   FLUSH,
   REHYDRATE,
   PAUSE,
   PERSIST,
   PURGE,
   REGISTER,
 } from 'redux-persist';

 import { authReducer, newsReducer } from '../features';

 const rootReducer = combineReducers({
   authReducer,
   newsReducer,
 });

 const persistConfig = {
   key: 'root',
   storage: AsyncStorage,
   whitelist: ['auth'],
 };

 const persistReducers = persistReducer(persistConfig, rootReducer);

 const store = configureStore({
   reducer: persistReducers,
   middleware: getDefaultMiddleware({
     serializableCheck: {
       ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
     },
   }),
 });

 export const persistor = persistStore(store);

 export default store;

Кроме того, когда я настраиваю свое свойство промежуточного программного обеспечения из configureStore на 

middleware: getDefaultMiddleware({
    serializableCheck: {
      ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
    },
}),

Это приводит к следующей ошибке в моем консоль:

image

1 Ответ

0 голосов
/ 30 апреля 2020

Я не использовал Redux 'toolkit / createSlice() сам, но у них есть целый раздел по asyn c thunks: https://redux-starter-kit.js.org/api/createAsyncThunk

То есть вы dispatch() asyn c функционирует (действия, которые вызывают побочные эффекты) и не выполняет побочных эффектов в редукторах (и они не должны быть asyn c).

...