Как реализовать следующее в React Native Redux - Reducer - PullRequest
0 голосов
/ 31 января 2019

У меня есть действие под названием fetchProperties для получения некоторых списков и всех данных, связанных с данными.Ответ выглядит следующим образом, и я настраиваю магазин Redux с этой информацией (20 записей).

{
  "status":"success",
  "listings":[
             {
               "id": "1",
               "streetnum": "370",
               "streetname": "Pack Saddle Drive",
               "city": "Horseshoe Bay",
               "area": "Blue Lake Estates",
               "zipcode": "78657",
             },
             {...}
             // 20 out of 300 properties
             ],
  "total_found":300,
  "some_other" : "some other data"
}

Во время следующего вызова для получения следующих 20 списков API возвращает ту же структуру, что и выше, но я хочу добавить новый массив listings к старому массиву listings в хранилище Redux.

Для такого сценария, как написать редуктор?Я попытался, как показано ниже, но это не сработало,

    export default function propertiesList(state = { listings: [] }, action) {
  switch (action.type) {
    case FETCH_PROPERTIES:
      // return action.payload.body;
      return {
        ...state,
        listings: [...state.listings, ...action.payload.body]
      };
}

и конечное состояние должно выглядеть следующим образом:

{
  "status":"success",
  "listings":[
             {
               "id": "1",
               "streetnum": "370",
               "streetname": "Pack Saddle Drive",
               "city": "Horseshoe Bay",
               "area": "Blue Lake Estates",
               "zipcode": "78657",
             },
             {...}
             // 40 out of 300 properties
             ],
  "total_found":300,
  "some_other" : "some other data"
}

Ответы [ 2 ]

0 голосов
/ 01 февраля 2019

Я изменил редуктор на такой:

export default function propertiesList(state = { listings: [] }, action) {
  switch (action.type) {
    case FETCH_PROPERTIES:
      return {
        ...action.payload.body,
        listings: [...state.listings, ...action.payload.body.listings]
      };
    case EMPTY_PROPERTIES_STORE:
      return { listings: [] };
  }

, а также перед первым вызовом fetchProperties я вызвал action EMPTY_PROPERTIES_STORE, чтобы убедиться, что в моем пустом хранилище пусто listings массив

0 голосов
/ 31 января 2019

Вы просто должны добавить списки со своими старыми списками в случае успеха редуктора, например:

case FETCH_PROPERTIES:
  return { 
    ...state, 
    listings: [
      ...state.listings,
      ...action.payload.body,
    ]
  }

при условии, что FETCH_PROPERTIES - ваш случай успеха

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...