как смотреть несколько значений или изменение данных в целом

Question

У меня есть это в компоненте.Как вы видите, я наблюдаю за изменениями, а затем запускаю функцию обновления для обновления базы данных через вызов API.Есть ли способ убрать дубликат кода и просто наблюдать за изменениями данных в целом?Или объедините просмотр нескольких значений.

watch: {
    mutable_threshold_value: function(val, oldVal) {
        this.update();
    },
    mutable_minimal_margin_fixed_value: function(val, oldVal) {
        this.update();
    },
    mutable_value_percentage: function(val, oldVal) {
        this.update();
    },
},
methods: {
    update: function() {
        this.$http.patch('/api/v1.0/margin-steps/' + this.id, {
            params: {
                threshold_value: this.mutable_threshold_value,
                minimal_margin_fixed_value: this.mutable_minimal_margin_fixed_value,
                value_percentage: this.mutable_value_percentage
            }
        });
    },

Answer 1

Соберите treshold_value, minimal_margin_fixed_value и value_percentage в вычисляемое свойство payload.Эта полезная нагрузка - то, что вы отправляете в API.Из-за того, как работают вычисляемые свойства, вычисляемое свойство отслеживает переменные, от которых оно зависит.Если они изменяются, изменяется полезная нагрузка, и, таким образом, вызывается наблюдатель.Вместо этого просмотрите эту новую переменную payload и отправляйте полезную нагрузку на сервер при каждом ее изменении.

computed: {
    payload () {
        return {
            threshold_value: this.mutable_threshold_value,
            minimal_margin_fixed_value: this.mutable_minimal_margin_fixed_value,
            value_percentage: this.mutable_value_percentage
        }
    }
},
watch: {
    payload () {
        this.update();
    }
},
methods: {
    update: function() {
        this.$http.patch('/api/v1.0/margin-steps/' + this.id, {
            params: this.payload
        });
    },
}