javascript - 如何从多个对象中查找字符串？

Question

我正在尝试通过传递已删除的项目 ID 来更新 Redux reducer 中的状态。 Id 位于任务和关联列中。删除该项目的干净方法是什么？

到目前为止我的 reducer 看起来像这样:

case DELETE_TASK:
  const update =  delete state.tasks[`${action.payload.id}`]
  const findIdCol = ?
  return {

  }


const initState = {
      tasks: {
        "task1": {
          id: "task1",
          content: "hello1"
        },
        "task2": {
          id: "task2",
          content: "hello2"
        },
        "task3": {
          id: "task2",
          content: "hello3"
        }
      },
      columns: {
        "column1": {
          id: "column1",
          taskIds: []
        },
        "column2": {
          id: "column2",
          taskIds: []
        },
        "column3": {
          id: "column3",
          taskIds: ["task3", "task1"]
        }
      },
      main: {
        "main": {
          id: "main",
          taskIds: ["task2"]
        }
      },
      columnOrder: ["column1", "column2", "column3"],
      mainOrder: ["main"]
    };

Answer 1

您可以将列对象转换为其条目，从而允许您循环遍历每个条目您可以使用reduce重新创建列对象:

state.columns = Object.entries(state.columns).reduce((a, [k, v]) => {
  v.taskIds = v.taskIds.filter(taskId => taskId !== action.payload.id)
  a[k] = v
  return a
}, {})

演示:

const state = {
  tasks: {
    task1: { id: 'task1', content: 'hello1' },
    task2: { id: 'task2', content: 'hello2' },
    task3: { id: 'task2', content: 'hello3' }
  },
  columns: {
    column1: { id: 'column1',taskIds: [] },
    column2: { id: 'column2',taskIds: [] },
    column3: { id: 'column3',taskIds: ['task3', 'task1'] }
  },
  main: {
    main: { id: 'main', taskIds: ['task2']}
  },
  columnOrder: ['column1', 'column2', 'column3'],
  mainOrder: ['main']
}


const id = 'task1'

state.columns = Object.entries(state.columns).reduce((a, [k, v]) => {
  v.taskIds = v.taskIds.filter(taskId => taskId !== id)
  a[k] = v
  return a
}, {})

console.log(state)

在这种情况下，您可以将 id 替换为 action.payload.id。

如果你想重用这段代码，你可以将它变成一个函数:

const state = {
  tasks: {
    task1: { id: 'task1', content: 'hello1' },
    task2: { id: 'task2', content: 'hello2' },
    task3: { id: 'task2', content: 'hello3' }
  },
  columns: {
    column1: { id: 'column1',taskIds: [] },
    column2: { id: 'column2',taskIds: [] },
    column3: { id: 'column3',taskIds: ['task2', 'task1'] }
  },
  main: {
    main: { id: 'main', taskIds: ['task2']}
  },
  columnOrder: ['column1', 'column2', 'column3'],
  mainOrder: ['main']
}


const id = 'task2'

const removeId = (o, id) => {
  return Object.entries(o).reduce((a, [k, v]) => {
    v.taskIds = v.taskIds.filter(taskId => taskId !== id)
    a[k] = v
    return a
  }, {})
}

state.columns = removeId(state.columns, id)
state.main = removeId(state.main, id)


console.log(state)