@wtfcode/vue-merge
v2.1.2
Published
DeepMerge two object using Vue.set() so the obj remain reactive
Downloads
38
Maintainers
Readme
vue-merge
DeepMerge two object using Vue.set()
Vue.merge( obj, value, options) return mergedObj; arguments:
- obj -- the object where put new thing
- value -- the object with the new thing, can be nested as wanted, can be a value if options.startAt is a non empty path
- options -- an object with the options
- ignoreNull: false, -- true ignore null found on value, false merge null too
- ignoreUndefined: false, -- true ignore undefined found on value, false remove the key from obj
- replaceArray: false, -- true replace the array in any case even with an object, otherwise the array can be replaced only by non object data (number etc..)
- overwrite: false, -- true overwrite the array with the new one and set empty obj, false append new value to the end of existing array
- startAt: '', -- the path where to start on obj ex: 'property1.array1.0' will start on element 0 of array1 a subproperty of property1
- safePaths: ['*'], -- an array of path considered safe to modify, default to all, _ is the wildcard char ex: prop1.0._
- clone: false, --if the obj will we deepCloned using lodash.clonedeep
- logs: false --if the function have to log something to console (used for debug)
VUEX USAGE:
import Vue from 'vue'
import VueMerge from '@wtfcode/vue-merge'
Vue.use(VueMerge) // without this Vue.merge will be undefined
mutations:{
MERGE_STATE: (state, { value, options }) => Vue.merge(state, value, options)
}
USAGE:
import Vue from 'vue'
import VueMerge from '@wtfcode/vue-merge'
Vue.use(VueMerge) // without this Vue.merge will be undefined
obj = {
property1: {
array1: [
{
type: 'keyVal',
foo: 'bar',
val: null,
key: null
},
{
type: 'keyNum',
foo: null,
num: null,
key: 'one'
}
],
array2: ['a', 'b']
}
}
value = {
array1: {
0:{
val:'value',
key:'zero'
},
1:{
num: 20,
foo: 'baz'
}
},
array2: ['c', 'd']
}
Vue.merge(obj,value,{startAt: 'property1'})
console.log('obj', obj) //will output:
/*
{
property1: {
array1: [
{
type: 'keyVal',
foo: 'bar',
val: 'value',
key: 'zero'
},
{
type: 'keyNum',
foo: 'baz',
num: 20,
key: 'one'
}
],
array2: ['a', 'b', 'c', 'd']
}
}
*/