-
-
Save leodutra/0cfd71fb13e77fa674cc0ceb18477751 to your computer and use it in GitHub Desktop.
import { mapState } from 'vuex' | |
export default function mapStatesTwoWay (namespace, states, updateCb) { | |
const mappedStates = mapState(namespace, states) | |
const res = {} | |
for (const key in mappedStates) { | |
res[key] = { | |
set (value) { | |
updateCb.call(this, { [key]: value }) | |
}, | |
get () { | |
return mappedStates[key].call(this) | |
} | |
} | |
} | |
return res | |
} |
This is an awesome idea would this work for a complex inject like this:
Car: {
Color: "blue",
Tags: ["compact","good gas mileage"]
}
Depends mostly of your mutation or handling on update callback.
Currently, it calls the update callback passing the new value of the named state.
So if you use lodash.merge(), in your mutation, it whould easily deep change the array too.
//...
...mapStatesTwoWay('assinatura', {
Color: state => state.current.Car.Color,
Tags: state => state.current.Car.Tags
}, function (stateUpdate) {
this.updateCurrent({ Car: stateUpdate }) // requires lodash.merge() over Object.assign()
}
//...
This is probably asking way too much but could you show a quick form example, it might be useful for others too where you have a form and are using v-model to do the two way using your idea here? I really think this needs to make it's way into vuex as a standard and this is a great idea, thanks for contributing it!
Sorry for the delay... I'll create a module and a demo as soon as possible... please remind me it it takes too long.
Sample usage: