Я хочу отфильтровать массив объектов по идентификаторам в другом массиве - PullRequest
0 голосов
/ 07 февраля 2020

У меня есть массив объектов, т.е. queueDetails[{},{}]. У меня есть другой массив идентификаторов из ответа "payload":[{"id":"1"},{"id":"2"}]. Я хочу filter идентификаторы в полезной нагрузке от queueDetails, для которых у меня есть следующий код:

action.payload.map(payload => {
       state.queueDetails.filter(queue => queue._id !== payload.id)              
})

return {
           ...state,
           queueDetails: ???
        }

Как мне продолжить отсюда.

1 Ответ

1 голос
/ 07 февраля 2020

Я думаю, можно с уверенностью предположить, что вы создаете часть редуктора магазина Redux, в этом случае соответствующий раздел case для действия фильтрации может быть чем-то вроде:

case FILTER_QUEUE_DETAILS : {
   const { queueDetails } = state,
         { payload } = action,
         submittedIds = payload.map(({id}) => id)
   return {...state, queueDetails: queueDetails.filter(({id}) => !submittedIds.includes(id))}
}

Вы может найти быстрое демо ниже:

const { createStore } = Redux
      
const defaultState = {queueDetails:[{id:1,data:'somedata'},{id:2,data:'moredata'},{id:3,data:'somemore'}]},
      FILTER_QUEUE_DETAILS = 'FILTER_QUEUE_DETAILS',
      appReducer = (state=defaultState, action) => {
        switch(action.type) {
          case FILTER_QUEUE_DETAILS : {
             const { queueDetails } = state,
                   { payload } = action,
                   submittedIds = payload.map(({id}) => id)
             return {...state, queueDetails: queueDetails.filter(({id}) => !submittedIds.includes(id))}
          }
          default: return state
        }
      },
      store = createStore(appReducer)

//initial state
console.log(`// initial state:\n`, store.getState())      

//dispatch action to filter out id's 1, 3
store.dispatch({
  type: FILTER_QUEUE_DETAILS,
  payload: [{id:1},{id:3}]
})

//log resulting state
console.log(`// state upon id's 1 and 3 filtered out:\n`,store.getState())
.as-console-wrapper {min-height:100%}
<script src="https://cdnjs.cloudflare.com/ajax/libs/redux/4.0.5/redux.min.js"></script>
...