VueJS зависимые свойства

Question

Существует форма с 3 полями,

1. Итого товара (кол-во)
2. Цена за единицу (единичный предмет)
3. Итого по цене (все товары)

Сценарий такой: пользователь вводит Total Item вместе с одним другим значением, либо цена за единицу, либо общая цена. Если пользователь вводит цену за единицу, мне нужно рассчитать общую цену путем умножения общей суммы товара на единицу.цена, если пользователь вводит общую цену, я должен разделить ее на общую сумму и получить цену за единицу.

Я пытаюсь достичь этого с включением цены за единицу и общей стоимости в watch без успеха, вот мой код,

  watch:{
        unit_rate: function(newVal){
            if(newVal != ''){
                this.total_rate = parseInt(this.total_item) * parseFloat(newVal);
            }else{
                this.total_rate = '';
            }
        },
        total_rate: function(newVal){
            if(newVal != ''){
                this.unit_rate = parseFloat(newVal) / parseInt(this.total_item);
            }else{
                this.unit_rate = '';
            }
        }
    },

Я не уверен, могу ли я изменить свойствокак это, пока они оба уже в наблюдении.Я тоже не получил ожидаемый вывод, что-то не так ,,

Answer 1

Я нашел ответ на свои вопросы сам из других постов, вот ссылка VueJS просмотр свойств и изменение данных