In the Redux DevTools in Chrome, I have an initialization of the pimRegistration state shown below. The nesting being referenced is pimRegistration
(state.domain.patient
):
https://i.sstatic.net/inJRl.png
To update the patient.name
object, I used the following spread operator statement:
store.update((state) => ({
...state,
...patientPath,
...{ [property]: value },
}));
Where property
is the "name" property of the patient object with value
. After the update, the new state is shown in the screenshot below:
https://i.sstatic.net/Zmfdb.png
Note that the original patient object (purple in the screenshot) is updated with the name object, duplicated and placed at the root of the state (yellow in screenshot).
I am looking to overwrite the properties of the
pimRegistration(state).domain.patient
object, rather than creating a new patient object.
The state update function is called as follows.
store.update((state) => ({
...state,
...patientPath, // state.domain.patient
...{ [property]: value },
}));
I have tried various combinations without achieving the desired result.
The complete update function is shown below.
update(property: string, path: string, value: any) {
const paths: string[] = path.split(".");
const pathReducer = (state: IRegistrationState, path_: string) => {
if (paths.length <= 0) {
return state.domain;
}
return state[path_];
};
const domainPath = state.domain;
let patientPath, nokPath, referrerPath;
if (path.includes("patient")) {
patientPath = paths.reduce(pathReducer, state);
}
if (path.includes("nok")) {
nokPath = paths.reduce(pathReducer, state);
}
if (path.includes("referrer")) {
referrerPath = paths.reduce(pathReducer, state);
}
store.update((state) => ({
...state,
...patientPath,
...{ [property]: value },
}));
}
The function above is called using the statement below in Angular 2.
if (this.path.includes("patient")) {
this._repo.update("name", "domain.patient", this.name);
}
Thanks