Обновить тот же магазин с некоторыми значениями реагировать-редукса

Question

Есть ли способ обновить только некоторые значения в коллекции объектов в хранилище ReactJS? У меня есть вызов, который получает мне весь список клиентов с некоторым анонимным значением. Мне нужно обновить магазин после получения этого ответа, но затем снова сделать еще один вызов службы с этими анонимными данными, чтобы получить реальные значения. Мне нужны данные как от первого звонка, так и от второго, чтобы получить всю информацию для моей сетки данных. Итак, как мне обновить мой магазин только с некоторой парой ключ-значение, а не со всем набором данных в приложении act-redux?

Answer 1

Вы не предоставили никакого кода, но... вы бы сделали это в своем редукторе.

Допустим, у вас есть редуктор с именем clientReducer, вы можете сделать что-то вроде этого, если это всего лишь один объект, как вы заявили выше.

function clientReducer(state, action) {
   return Object.assign({}, state, {
     [action.payload.key] : action.payload.value
   }
}

Ваше действие будет выглядеть примерно так:

 function changeClientValue(key, value) {
    return {
      type: 'CHANGE_CLIENT_VALUE',
      payload: {
        key: key,
        value: value
      }
    }
 }

Я считаю, что для массива объектов это должно работать без использования каких-либо дополнительных библиотек, таких как неизменяемый JS. Хотя я не проверял это!

const initialState = [
    {
        id: 1,
        clientFirstN‌​ame: 'Paul',
        ...otherFields
    },
    {
        id: 2,
        clientFirstN‌​ame: 'Adam',
        ...otherFields
    }
];

// Reducers
function clientSubReducer(state = initialState, action) {
    switch(action.type) {
        case 'MODIFY_CLIENT':
            return {
                ...state[action.payload.index],
                ...action.payload.fields
            }
    }
}

export function clientReducer(state, action) {
    switch(action.type) {
        case 'MODIFY_CLIENT':
            return [
                ...state.slice(0, action.payload.index),
                clientSubReducer(state, action),
                ...state.slice(action.payload.index + 1)
            ]
    }
}


//Action
function modifyClient(client) {
    return (dispatch, getStore) => {
        const store = getStore();
        let storeIndex = -1;

        for (let i = 0; i < store.clients.length; i++) {
            const storeClient = clients[i];
            if (client.id === storeClient.id) {
                storeIndex = i;
            }
        }

        // Our store contains the client object
        if (storeIndex > -1) {
            dispatch({
                action: 'MODIFY_CLIENT',
                payload: {
                    index: storeIndex,
                    fields: client // You could diff the client and store client and pass only the ones you want to modify back
                }
            })
        }
        //Our Store does not contain the client object
        else {
            dispatch({
                action: 'ADD_CLIENT',
                payload: {
                    client: client
                }
            })
        }
    }
}