Блог

У меня есть следующие пользовательские данные в состоянии

 userData : {
 isValidCheckup: true,
 accounts: {
  userAccount: [
    {
      accountType: 'checkings',
      includeInCheckup: false
    },
    {
      accountType: 'checkings',
      includeInCheckup: false
    }
  ]
}
  

Теперь у меня есть редуктор для обработки вышеуказанных данных. Примечание: я хочу только обновить includeInCheckup поле. В зависимости от accountType полученной в качестве полезной нагрузки для редуктора.

Вот функция редуктора, которую я использую

 case UPDATE_USER_DATA: {
  const { field, value } = action.payload; // field='checkings', value=true
  return {
   ...state,
   userData: {
     ...state.userData
   }
  }

} 
  

Как вы можете видеть, я получаю field='checkings', value=true от полезной нагрузки к редуктору. Как я могу конкретно обновить это значение до includeInCheckup свойства на основе значения поля.

Может кто-нибудь, пожалуйста, пролить немного света.

Когда я получаю поле как «проверки», я обновляю первый элемент массива «UserAccount», а когда я получаю поле как «сбережения», я обновляю второй элемент массива.

Например, state, я предполагаю userAccount[0] userAccount[1] , что это тип текущего счета и тип сберегательного счета, а массив всегда будет иметь длину 2.

 userData : {
 isValidCheckup: true,
 accounts: {
  userAccount: [
    {
      accountType: 'checkings',
      includeInCheckup: false
    },
    {
      accountType: 'savings',
      includeInCheckup: false
    }
  ]
}
  

Скопируйте каждый уровень состояния, который обновляется, а затем обновите свойство, создав новую ссылку на объект / массив. Вы можете просто сопоставить userAccount массив и проверить, соответствует ли тип учетной записи типу поля полезной нагрузки действия, и обновить includeInCheckup свойство.

 case UPDATE_USER_DATA: {
  const { field, value } = action.payload; // field='checkings', value=true
  return {
    ...state,
    userData: {
      ...state.userData,
      accounts: {
        ...state.userData.accounts,
        userAccount: state.userData.accounts.map((account) =>
          account.accountType === field
            ? {
                ...account,
                includeInCheckup: value
              }
            : account
        )
      }
    }
  };
}