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

где я пропал? пожалуйста, помогите разобраться с этим _/_ у меня проблемы с правильным обновлением состояния хранилища избыточности без нарушения

Это мое текущее состояние в состоянии хранилища избыточности перед публикацией данных.

next state Object {
  "highlights": Object {
    "errMess": null,
    "highlights": Array [],
    "isLoading": true,
  },
  "posts": Object {
    "errMess": null,
    "isLoading": false,
    "posts": Array [
      Object {
        "__v": 0,
        "_id": "5f37c3ebc8cb6a46c89bc33c",
        "by": Object {
          "_id": "5ed8d7fcfd3da42bc426992a",
          "name": "mad",
          "username": "mad",
        },
        "content": "this is first post",
        "contentWarn": false,
        "createdAt": "2020-08-15T11:15:55.986Z",
        "flaged": false,
        "heading": "first pot",
        "report": 0,
        "updatedAt": "2020-08-15T11:15:55.986Z",
      },
    ],
  },
}

то действие добавления нового поста выполняется с помощью редюсера====›

export const posts = (
  state = { isLoading: true, errMess: null, posts: [] },
  action
) => {
  switch (action.type) {
 
   case ActionTypes.UPDATE_POSTS:
      return {
        posts: state.posts.posts.concat(action.payload),
      };
    default:
      return state;
  }
};

это ошибка возвращается

 action     Object {
  "payload": [TypeError: undefined is not an object (evaluating 'state.posts.posts.concat')],
  "type": "UPDATE_POSTS_FAILED",
}

undefined is not an object (evaluating 'state.posts.posts.concat')
* Redux\posts.js:24:13 in posts

это результат, который я хотел получить

next state Object {
  "highlights": Object {
    "errMess": null,
    "highlights": Array [],
    "isLoading": true,
  },
  "posts": Object {
    "errMess": null,
    "isLoading": false,
    "posts": Array [
      Object {
        "__v": 0,
        "_id": "5f37c3ebc8cb6a46c89bc33c",
        "by": Object {
          "_id": "5ed8d7fcfd3da42bc426992a",
          "name": "mad",
          "username": "mad",
        },
        "content": "this is first post",
        "contentWarn": false,
        "createdAt": "2020-08-15T11:15:55.986Z",
        "flaged": false,
        "heading": "first pot",
        "report": 0,
        "updatedAt": "2020-08-15T11:15:55.986Z",
      },
     Object {
        "__v": 0,
        "_id": "5f37c3ebc8cb6a46c89bc33c",
        "by": Object {
          "_id": "5ed8d7fcfd3da42bc426992a",
          "name": "mad",
          "username": "mad",
        },
        "content": "this is second post",
        "contentWarn": false,
        "createdAt": "2020-08-15T11:15:55.986Z",
        "flaged": false,
        "heading": "second post",
        "report": 0,
        "updatedAt": "2020-08-15T11:15:55.986Z",
      }
    ],
  },
}

reactjs javascript redux state
person Madhav Gautam    schedule 15.08.2020    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Ваш редуктор должен иметь следующие конструкции с двумя уровнями:

export const posts = (
  state = {
    highlights: {
      errMess: null,
      highlights: [],
      isLoading: true,
    },
    posts: { isLoading: true, errMess: null, posts: [] },
  },
  action
) => {
  switch (action.type) {
    case ActionTypes.UPDATE_POSTS:
      return {
        ...state,
        posts: state.posts.posts.concat(action.payload),
      };
    default:
      return state;
  }
};

и постарайтесь сохранить в состоянии ту же структуру данных, что и основные моменты!

person Lafi    schedule 15.08.2020
comment
Спасибо за ответ. На самом деле у меня есть еще один редуктор для выделения в другом файле. .полезная нагрузка), }; - person Madhav Gautam; 15.08.2020
comment
``` case ActionTypes.UPDATE_POSTS: return { ...state, posts: state.posts.push(action.payload), } ``` Я внес это изменение... состояние обновляется правильно, но... выдает ошибку Предупреждение: может не выполнять обновление состояния React для несмонтированного компонента. Это неоперативка...... - person Madhav Gautam; 16.08.2020

arrow_upward
0
arrow_downward 

      return {
        ...state,
        posts: state.posts.concat(action.payload),
      }

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

person Madhav Gautam    schedule 16.08.2020