Как передать вычисленный результат параметру в vue2.js

Question

Я хочу, чтобы вычисленный результат мог быть передан параметру.
Код ниже:

<el-input v-model="ruleForm.volexp"/>{{ calVol }} = {{ ruleForm.vol }}

data() {
  return {
    ruleForm: { volexp: '', vol: 0 }
  }
},
computed: {
  calVol: function() {
    try {
      const r = eval(this.ruleForm.volexp).toFixed(2)
      this.ruleForm.vol = r 
      return r
    } catch (err) {
      return ''
    }
  }
},

Однако выдается предупреждение:

Неожиданный побочный эффект в вычисляемом свойстве "calVol".

Как это исправить?

Answer 1

Вы не можете установить data в computed.И похоже, что у вашего кода есть логическая проблема, он будет всегда равным данным на вашем взгляде {{ calVol }} = {{ ruleForm.vol }}, поэтому он также может быть {{ calVol }} = {{ calVol }} ничего не изменится.

И, следуя вышеприведенной проблеме, это может быть ваше предупреждение.Если это какой-то калькулятор формул, он должен выглядеть следующим образом:

<el-input v-model="ruleForm.volexp"/>{{ ruleForm.volexp }} = {{ calVol }}

data() {
  return {
    ruleForm: { volexp: ''}
  }
},
computed: {
  calVol: function() {
    try {
      return eval(this.ruleForm.volexp).toFixed(2);
    } catch (err) {
      return '';
    }
  }
},

ОБНОВЛЕНИЕ В зависимости от комментария, который вы написали выше для @ tony19: @ tony19, поскольку параметр ruleForm будет введенк внутреннему API.Мне нужно сохранить оба volexp и vol. .Вы можете отправлять вычисленные как обычные данные на сервер, например, this.$axios.post('/api/url', {a: this.calVol, b:this.volexp}), если вы используете axios.Аналогичный синтаксис для любого другого http-библиотеки.

Answer 2

Возможно, вам следует использовать watcher для ruleForm.volexp вместо вычисляемых свойств, чтобы установить ruleForm.vol.