Сохранять вложенный объект состояния с использованием приставки - PullRequest
Новая
       66

Сохранять вложенный объект состояния с использованием приставки

0 голосов
/ 11 ноября 2018

Я пытаюсь сохранить свое состояние, используя redux-persist API. У меня есть государственная структура, как показано ниже. 

var initState = {
  searchInp: "",
  allProducts: {},
  isProductDtlsLoading: true
};

Где allProducts - массив вложенных объектов с каждой структурой объекта, как показано ниже: 

allProducts : {
004: {
   defaultOffer: null
   mrp: 550
   productData: [{…}]
   productName: "Hair Dryer"
   productQty: 0
   sellingPrice: 450
   prodCode: "004"
   }
}

Теперь, когда я пытаюсь сохранить данные, я вижу, что инструменты разработчика Chrome на вкладке «Приложение», значение для searchInp сохраняется нормально и не теряется из-за обновления страницы. Значение для allProducts корректно обновляется в постоянном хранилище, но затем при обновлении значение теряется, и, скажем, productQty по умолчанию равно 0. Как я могу сохранить свойства вложенного объекта, такие как productQty в этом случае?

index.js 

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { Provider } from "react-redux";
import { createStore, applyMiddleware } from "redux";
import rootReducer from "./Store/Reducers/reducer";
import thunk from "redux-thunk";
import { persistStore, persistReducer } from "redux-persist";
import storage from "redux-persist/es/storage/session";
import { PersistGate } from "redux-persist/lib/integration/react";
import hardSet from "redux-persist/lib/stateReconciler/hardSet";

const persistConfig = {
  key: "root",
  storage: storage,
  stateReconciler: hardSet
};

var pReducer = persistReducer(persistConfig, rootReducer);

var store = createStore(pReducer, applyMiddleware(thunk));
var persistor = persistStore(store);

var app = (
  <Provider store={store}>
    <PersistGate persistor={persistor} loading={null}>
      <App />
    </PersistGate>
  </Provider>
);

ReactDOM.render(app, document.getElementById("root"));

Ответы [ 2 ]

0 голосов
/ 30 ноября 2018

Скорее всего, вы изменяете свое состояние вместо того, чтобы заменить его новым. redux-persist полагается на тот факт, что состояние является неизменным, и оно должно правильно сохранять изменения, если они не были изменены, см. Некоторые обсуждения здесь https://github.com/rt2zz/redux-persist/issues/623. Так что убедитесь, что вы правильно обновляете свое состояние и с вложенными объектами это может быть хитро, вот некоторая информация об этом Более чистый / более короткий способ обновить вложенное состояние в Redux?

0 голосов
/ 13 ноября 2018

У меня довольно сложное состояние в моем приложении, и этот способ отлично работает для меня: https://stackoverflow.com/a/37690899/7317796

...