Mail.ruПочтаМой МирОдноклассникиВКонтактеИгрыЗнакомстваНовостиКалендарьОблакоЗаметкиВсе проекты

Ошибка с Redux-Persist

Союз Здравых Сил Профи (505), на голосовании 2 часа назад
Вся работа происходит в 2х файлах - configureStore.jsx(где инициализируем persist, настраиваем и экспортируем) и App.jsx, где оборачиваем приложение в PersistGate , чтобы оно имело доступ к новому store. Вроде сделал всё по интсрукции - но всё равно вылетает куча ошибок, при чём разных:

 // configureStore.jsx 

import { persistStore, persistReducer } from 'redux-persist'
import storage from "redux-persist/lib/storage"; // наше хранилище(как localStorage)


const persistConfig = { // делаем persist-config
key: 'root',
storage,
}
const persistorReducer = persistReducer(persistConfig, reducer)


export const store = configureStore({
reducer: {
persistorReducer,
[api.reducerPath]: api.reducer,
},
middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(api.middleware)
})
export const persistor = persistStore(store)
  Api.jsx 

// Redux-dependencies
import { Provider } from 'react-redux';
import { store } from './store/configureStore';

// Redux-Persist
import { PersistGate } from 'redux-persist/integration/react';
import { persistor } from './store/configureStore';

const App = () => {

return (







)
}

export default App;


Ошибок, как видно, много и они разные - в чём же проблема?

*Примеры ошибок:
1) bundle.js:79382 A non-serializable value was detected in an action, in the path: `register`. Value: ƒ register(key) {
_pStore.dispatch({
type: _constants__WEBPACK_IMPORTED_MODULE_0__.REGISTER,
key: key
});
}
Take a look at the logic that dispatched this action:
{type: 'persist/PERSIST', register: ƒ, rehydrate: ƒ}
2) Uncaught TypeError: Cannot destructure property 'cartObject' of '(0 , react_redux__WEBPACK_IMPORTED_MODULE_8__.useSelector)(...)' as it is undefined.
3) Error handled by React Router default ErrorBoundary: Error: A component suspended while responding to synchronous input. This will cause the UI to be replaced with a loading indicator.

ну и тд
Голосование за лучший ответ
Инспектор Жопидý Оракул (53453) 1 месяц назад
Ошибки Redux-Persist в вашем коде
1. Несериализуемое значение в действии:
• Ошибка указывает, что в вашем приложении есть действие, которое содержит несериализуемое значение. Redux-Persist не может сохранить несериализуемые значения в хранилище, что приводит к сбою.
• В предоставленном вами коде пример ошибки относится к действию register.
• Вам нужно будет найти это действие и изменить его так, чтобы оно не содержало несериализуемых значений.
• Один из способов сделать это - преобразовать несериализуемые значения в сериализуемые, например, JSON.
2. Неопределенное свойство cartObject:
• Эта ошибка указывает на то, что компонент пытается получить доступ к свойству cartObject из состояния Redux, но оно не определено.
• Это может быть вызвано тем, что редуктор, управляющий cartObject, не обновляется должным образом.
• Вам нужно будет проверить свой редуктор и убедиться, что он правильно обновляет cartObject.
3. Ошибка React Router:
• Эта ошибка указывает на то, что в вашем приложении есть компонент, который приостанавливается во время ответа на синхронный ввод.
• Это может привести к проблемам с отрисовкой и другим ошибкам.
• Вам нужно будет найти компонент, который вызывает эту ошибку, и изменить его так, чтобы он не приостанавливался во время ответа на синхронный ввод.
Дополнительные советы:
• Убедитесь, что вы используете последнюю версию Redux-Persist.
• Проверьте документацию Redux-Persist на наличие дополнительных сведений об устранении неполадок: https://blog.logrocket.com/persist-state-redux-persist-redux-toolkit-react/
• Используйте инструменты разработчика браузера для отладки ошибок Redux.
Решение:
• Несериализуемое значение в действии:
o Найдите действие register и измените его так, чтобы оно не содержало несериализуемых значений.
o Преобразуйте несериализуемые значения в сериализуемые, например, JSON.
• Неопределенное свойство cartObject:
o Проверьте свой редуктор, управляющий cartObject, и убедитесь, что он правильно обновляет cartObject.
• Ошибка React Router:
o Найдите компонент, который вызывает эту ошибку, и измените его так, чтобы он не приостанавливался во время ответа на синхронный ввод.
Рекомендации:
• Используйте более дескриптивные имена ключей и значений в persistConfig.
• Добавьте обработку ошибок в свой код, чтобы вы могли лучше понять, что происходит, когда возникают ошибки.
• Используйте инструменты тестирования, чтобы убедиться, что ваш код работает правильно.
Союз Здравых СилПрофи (505) 1 месяц назад
Ох, ё..
Я думал с redux-persist всё просто
А можете объяснить что такое несериалезуемое/сериалезуемое значение в приложении?
Союз Здравых СилПрофи (505) 1 месяц назад
"В предоставленном вами коде пример ошибки относится к действию register" - в react-hook-form есть register, это про него? Больше я такое значение нигде не использовал
Похожие вопросы