react-native - Multiple Item Objects In Redux Store

Question

I have following store on Redux:

{
  "forgotPassword": {
    "item": {
      "error": "ok",
      "params": {
        "email": "[e-mail]"
      },
    },
    "fetchEmail": {
      "loading": false,
      "error": null
    },
    "fetchChangePassword": {
      "loading": false,
      "error": null
    }
  },
  "_persist": {
    "version": -1,
    "rehydrated": true
  }
}

But I want my store like this:

The difference is item object is there for both fetchEmail and fetchChangePassword objects.

{
  "forgotPassword": {
    "fetchEmail": {
      "item": {
          "error": "ok",
          "params": {
              "email": "[e-mail]"
          },
      },
      "loading": false,
      "error": null
    },
    "fetchChangePassword": {
      "item": {
          "error": "ok",
          "params": {
              "email": "[e-mail]"
          },
      },
      "loading": false,
      "error": null
    }
  },
  "_persist": {
    "version": -1,
    "rehydrated": true
  }
}

This is my file structure;

Store
--ForgotPassword
----FetchEmail.js
----FetchChangePassword.js
----index.js
--index.js

---

//FetchEmail.js
export default {
  initialState: buildAsyncState('fetchEmail'),
  action: buildAsyncActions('forgotPassword/fetchEmail', fetchEmailService),
  reducers: buildAsyncReducers({
    errorKey: 'fetchEmail.error', 
    loadingKey: 'fetchEmail.loading',
  }),
}

---

//FetchChangePassword.js
export default {
  initialState: buildAsyncState('fetchChangePassword'),
  action: buildAsyncActions('forgotPassword/fetchChangePassword', fetchChangePasswordService),
  reducers: buildAsyncReducers({
    errorKey: 'fetchChangePassword.error',
    loadingKey: 'fetchChangePassword.loading',
  }),
}

---

//ForgotPassword/index.js

import FetchEmail from './FetchEmail'
import FetchChangePassword from './FetchChangePassword'


const sliceInitialState = {
  item: {},
}

export default buildSlice('forgotPassword', [FetchEmail, FetchChangePassword], sliceInitialState).reducer

---

I have tried following changes:

Changed item objects accordingly.

//ForgotPassword/index.js
const sliceInitialState = {
  itemEmail: {},
  itemChangePassword: {},
}

Added following to my reducers:

//FetchFetch.js
itemKey: 'fetchChangePassword.itemFetch',

//FetchChangePassword.js
itemKey: 'fetchChangePassword.itemChangePassword',

How can I add item object to my reducers separately?

标签： react-nativereduxredux-toolkit