Let's say I'm utilizing an external API that interacts with Machine objects. With the API, you can create a Machine using createMachine, resulting in a complex object with various nested properties and functions to modify its state. The API includes methods like: loadMemory, sleep, connectDevice. (Just for illustration purposes).
To maintain a global Vuex Machine object, I've set up an action to dispatch the initial creation and store the returned object like this:
actions: {
createChannel({ commit, state }, params) {
m.createMachine(params).then(
function (newMachine) {
commit('setMachine', newMachine);
}
).catch(err => { console.error("Error"); } )
}
}
The mutation for this scenario is rather simple:
setMachine(state, machine) {
state.machine = machine;
}
Since the API provides methods that alter the state of "Machine" objects but we're unsure which specific fields they modify, I aim to encapsulate them in actions.
An action might look like this:
this.state.machine.loadMemory(mem.addr)If this call changes the machine object itself, how do I update the state? Should I clone the original object, apply the state-changing method, and replace the object?
I am aware that cloning is not a straightforward task.
Appreciate any advice.