Почему я получаю "redux-persist / createPersistoid: ошибка сериализации состояния"? - PullRequest
0 голосов
/ 01 февраля 2020

Понятия не имею, почему я получаю эту ошибку. нет ссылки на файл, нет ссылки на строку. Я знаю только то действие, которое выполнено, что приводит к ошибке.

Полная ошибка:

console.error "redux-persist/createPersistoid: error serializing
state", TypeError: JSON.stringify cannot serialize cyclic structures.

Вот действие, которое вызывает ошибку:

export const loadInitialDiscover = () => {
    return (dispatch) => {
        dispatch({ type: types.DISCOVER_LOADING });
        return getNewest(dispatch);
    };
};
const getNewest = (dispatch) => {
    return firebase
        .firestore()
        .collection('users')
        .where('role', '==', 'a')
        .where('active', '==', true)
        .orderBy('createdAt')
        .limit(10)
        .get()
        .then((querySnapshot) => {
            const newest = [];
            querySnapshot.forEach((queryDocSnapshot) => {
                const profile = queryDocSnapshot.data();
                newest.push(profile);
            });
            dispatch({ type: types.LOAD_NEWEST, payload: newest });
        })
        .catch((err) => loadFail(dispatch, err.message));
};

выполнение действия на экране:

componentDidMount () {
    //console.log('INITIAL REDUX STATE: ' + JSON.stringify(this.props.newest));
    this.props.newest == null ? this.props.loadInitialDiscover() : null;
}

обратите внимание, что .stringify () закомментирован

Я удалил буквально все существующие JSON.stringify, удаленную папку сборки, перезапущенный пакет, перезапущенный симулятор. ошибка сохраняется.

здесь есть соответствующий редуктор:

const INITIAL_STATE = {
    newest: null,
    loading: false,
    error: ''
};
export default (state = INITIAL_STATE, action) => {
    switch (action.type) {
        case types.DISCOVER_LOADING:
            return {
                ...state,
                loading: true,
                error: ''
            };
        case types.LOAD_FAIL:
            return {
                ...state,
                loading: false,
                error: action.info
            };
        case types.LOAD_NEWEST:
            return {
                ...state,
                loading: false,
                error: '',
                newest: action.payload
            };
   }
}

и вот постоянная конфигурация:

const persistAuthConfig = {
    key: 'auth',
    storage: AsyncStorage
};
const persistUserConfig = {
    key: 'user',
    storage: AsyncStorage
};

const persistDiscoverConfig = {
    key: 'discover',
    storage: AsyncStorage
};

const AppReducer = combineReducers({
    auth: persistReducer(persistAuthConfig, AuthReducer),
    user: persistReducer(persistUserConfig, UserReducer),
    discover: persistReducer(persistDiscoverConfig, DiscoverReducer)
});

export default AppReducer;

Как устранить эту ошибку?

1 Ответ

0 голосов
/ 02 февраля 2020

Ответ на запрос Firestore содержит циклические c данные (параметр ref), которые невозможно сериализовать с помощью JSON .stringify, следовательно, возникает ошибка от Redux-Persist (да; использовать redux-persist использовать под капотом). Просто удалите параметр ref, содержащий данные cycli c, из всех объектов, вставленных в массив newest array. Также проверьте другие параметры, которые нельзя сериализовать с помощью JSON .stringify, например ref. Ниже может помочь вам достичь этого: -

const newest = []; querySnapshot.forEach((queryDocSnapshot) => { 
const profile = queryDocSnapshot.data();
const {ref, ...profileSerialisable} = profile;
newest.push(profileSerialisable); 
});

Пожалуйста, обратитесь здесь для дополнительных обсуждений, основанных на этом.

...