当相应项中没有值时，从 Redux 初始状态中删除完整对象

Question

在我的减速器中，我的初始状态如下所示：    const initialState = {        isLoading: false,        events: [        {        year: 2021,        place: [        {          id: 1,          name: "BD"        },        {          id: 2,          name: "BD Test"        }      ]    },    { year: 2020, place: [{ id: 3, name: "AMS" }, { id: 4, name: "AMS TEST" }] }  ]};我一直在尝试实现删除操作的功能。因此，当单击按钮时，将调度“deleteItems”操作，该操作将从place. 此功能工作正常。但是，events如果place.这是我已经尝试过的，但它只是删除了个人place. place但是，我需要在这里编写当变为空时删除整个项目的逻辑。case "deleteItems":  return {    ...state,    events: state.events.map(event => {      const place = event.place.find(x => x.id === action.id);      if (place) {        return {          ...event,          place: event.place.filter(x => x.id !== action.id)        };      }      return event;    })  };因此，在修改后，状态将如下所示：（当 2021 年没有值时）const initialState = {  isLoading: false,  events: [    { year: 2020, place: [{ id: 3, name: "AMS" }, { id: 4, name: "AMS TEST" }] }  ]};有谁知道如何做到这一点。任何帮助将不胜感激。在此先感谢。Demo可以从这里看到

Answer 1

我先删除了这些地方。然后我根据位置数组是否为空来过滤事件。之后，我返回了状态。

case "deleteItems":

      const eventsPostDeletingPlaces = state.events.map(event => {

        const place = event.place.find(x => x.id === action.id);

        if (place) {

          return {

            ...event,

            place: event.place.filter(x => x.id !== action.id)

          };

        }

        return event;

      });

      const eventsWithPlaces = eventsPostDeletingPlaces.filter((each) => each.place.length);

      return {

        ...state,

        events: eventsWithPlaces

      }

在此处检查已编辑的沙箱

Answer 2

基本上与第一个答案中的逻辑相同，但用a和 extrareduce代替。只是一种选择。mapfilter

case "deleteItems":

  return {

    ...state,

    events: state.events.reduce((events, event) => {

      const place = event.place.find(x => x.id === action.id);

      if (place) {

        event.place = event.place.filter(x => x.id !== action.id);

      }

      if (event.place.length > 0) {

        events.push(event);

      }

      return events;

    }, [])

  };

密码箱