Как вычислить свойство на основе объекта с запасным вариантом - PullRequest
0 голосов
/ 03 февраля 2020

У меня есть компонент, который получает объект в виде prop, например:

props: ['propObject']

Затем определен объект по умолчанию (я использую VueX, поэтому он фактически определен как $store геттер, но для простоты, скажем, это определено в методе данных) в данных:

data() {
  return {
    dataObject: {defaultValueA: 1, defaultValueB: 2}
  }
}

И я хотел бы иметь вычисляемое свойство, которое будет вести себя так:

computed: {
  computedObject() {
    return Object.values(this.propObject).length > 0 ? this.propObject : this.dataObject;
  }
}

Однако я знаю, что это невозможно, потому что Vue наблюдатели не наблюдают за изменениями пар ключ / значение объекта. Я попытался go с наблюдаемым свойством, например:

props: ['propObject'],
data() {
  return {
    object: {},
    defaultObject: {}
  }
},
watch: {
  propObject: {
    handler: function() {
      this.setComputedObject();
    },
    deep: true
  }
},
methods: {
  setComputedObject() {
    this.object =  Object.values(this.propObject).length > 0 ? this.propObject : this.defaultObject;
  }
},
mounted() {
  this.setComputedObject();
}

Однако обработчик наблюдателя вообще не вызывается при изменении propObject, но если я вызываю его напрямую через консоль , оно работает. Есть ли способ, которым я могу заставить computedObject стать реактивным?

1 Ответ

1 голос
/ 03 февраля 2020

вам нужно использовать Vue.set / vm.$set, где вы меняете реквизит (в компоненте-источнике)

, например,

changeProp(){
this.$set(propObject,'newprop','newval');
}

, а затем просто вы вычислили в цели компонент (компонент, который получает опору)

источник: https://vuejs.org/v2/guide/list.html#Object -Change-Detection-Caveats

...