@gitlab/ui
Version:
GitLab UI Components
39 lines (36 loc) • 1.07 kB
JavaScript
import { extend } from '../vue';
import { cloneDeep } from './clone-deep';
import { looseEqual } from './loose-equal';
import { hasOwnProperty, keys } from './object';
const isEmpty = value => !value || keys(value).length === 0;
const makePropWatcher = propName => ({
handler(newValue, oldValue) {
if (looseEqual(newValue, oldValue)) {
return;
}
if (isEmpty(newValue) || isEmpty(oldValue)) {
this[propName] = cloneDeep(newValue);
return;
}
for (const key in oldValue) {
if (!hasOwnProperty(newValue, key)) {
this.$delete(this.$data[propName], key);
}
}
for (const key in newValue) {
this.$set(this.$data[propName], key, newValue[key]);
}
}
});
const makePropCacheMixin = (propName, proxyPropName) => extend({
data() {
return {
[proxyPropName]: cloneDeep(this[propName])
};
},
watch: {
// Work around unwanted re-renders: https://github.com/vuejs/vue/issues/10115
[propName]: makePropWatcher(proxyPropName)
}
});
export { makePropCacheMixin, makePropWatcher };