I have a state in a reducer that looks like this:
// The current source/selection
const selection = {
timespan: "-3660",
customTimespan: false,
pathIds: [''],
source: undefined,
direction: 0,
appClassIds: []
};
What I want now is to update multiple properties (timespan and customTimeSpan), something like this (but this doesn't work):
{ ...state,
{
timespan: action.timespan.value,
customTimespan: action.timespan.value
}
};
How can I update multiple properties of a state?
You need to remove the extra object closure from there
{ ...state,
timespan: action.timespan.value,
customTimespan: action.timespan.value
}
should work fine
If you wanted to do it in vanilla JS you could do this:
Object.assign({}, state, { timespan: action.timespan.value, customTimespan: action.timespan.value})
I think the spread operator is much cleaner and should go that route if you have access to it.
You can also achieve the same using the spread operator which allows you to have the new values in an object, instead of having to hardcode them:
const selection = {
timespan: "-3660",
customTimespan: false,
pathIds: [""],
source: undefined,
direction: 0,
appClassIds: []
};
const newSelectionValues = {
timespan: "-3600",
customTimespan: true
};
const newSelection = { ...selection, ...newSelectionValues };