Vuejs вычислено, сделать его реактивным

Question

Мне нужно сохранить вычисленное значение в моей базе данных, но, похоже, я не могу получить к нему доступ в следующем примере:

computed: {
    total: {
        get: function() {
            return this.items.reduce(
                (acc, item) => acc + (item.price * item.quantity) * (1 - item.discount/100), 0
            )
        },
        set: function(newValue) {
            console.log(newValue);
            // this.tototata = newValue;
        }
    }
},

В шаблоне вычисленное значение работает хорошо, но в console

Я работаю с vue 2.6.11

Это лучший способ сделать это? Должен ли я использовать методы?

Answer 1

Я думаю, что computed setter вызывается при ручной установке вычисленного значения. Например, сеттер будет срабатывать, если вы сделаете что-то вроде this.total = newTotal. Чтобы сохранить вычисленное значение в базе данных при каждом его обновлении, вы можете настроить наблюдатель:

computed: {
  total: {
    get: function() {
      return this.items.reduce(
        (acc, item) => acc + (item.price * item.quantity) * (1 - item.discount / 100), 0
      )
    }
  }
},
watch: {
  total(newValue) {
    // Save to database
  }
}

Подробнее о Computed Setter можно прочитать здесь. Надеюсь, что это поможет вам решить проблему.