step start, where does it end • Not everything can be undone • Not everything can be redone • How many steps do we allow to go back • Also: What about side effects?
state only select a node • Single mutations change a node title • Mixture select a node then highlight immediately • Multiple mutations insert a node between nodes • Side-effect actions upload image to server
how to mutate the state • and how to revert the mutation again Pro: • Smaller memory overhead, minimal processing Cons: • Specific mutations just for the sake of undo • Twice the implementation per mutation
store.registerModule("myModule", module); // register a module dynamically store.subscribe((mutation, state) => {...}); // called after every mutation store.subscribeAction({ before: (action, state) => {...}, // called before the action is executed after: (action, state) => {...} // called after action has resolved }); }; const store = new Vuex.Store({ ... plugins: [myPlugin] }); h"ps://vuex.vuejs.org/guide/plugins.html
to the store not in modules • store.subscribe and subscribeAction always see mutations and actions with the complete namespace • Plugins will o!en need explicit configuration
Save a base state for resetMutations • Replay all other mutations on top of the base state Pro: • Easy to generalize, moderate memory footprint Cons: • Potentially processing intensive • More complicated to setup
mutations from Vue Components • Instead always go through an action • Stay flexible • Protect your state changes • Perform validations before committing • Use objects as payload • Easy to add optional fields later • See mutations as past events • Manage complexity using namespaces Remember ⚠ Shared mutable state is hard
Niklas Lochschmidt
nlochschmidt
iamctodd
reverentgeek
rmw
skipperchong
carmenhchung
keathley
productmarketing
clairelew
thoeni
jcasabona
cherdarchuk
