Javascript 未定义Vue.js结果

关于我当前的代码，我收到了一个没有定义“result”的错误，但是如果我在数据区域中定义它，我会得到一个不能复制键的错误

<template>

<form>
  <label for="weightLifted">Weight Lifted</label>
  <input type="text" id="weightLifted" v-model="weightLifted">
  <br/>
  <label for="reps">Number of Reps</label>
  <input type="text" id="reps" v-model="reps">
  <br/>
  <label for="result">Max</label>
  <input type="text" id="result" v-model="result">
</form>

</template>
<style>


</style>
<script>
  export default {

    data() {
      return {
        weightLifted: '',
        reps: '',


      }
    },
    computed: {
      result: function () {
        return result = this.weightLifted * (1 + (this.reps / 30));
      }
    }
  }

</script>

举重


重复次数


马克斯
导出默认值{
数据（）{
返回{
举重：，
销售代表：''，
}
},
计算：{
结果：函数（）{
返回结果=this.weighted*（1+（this.reps/30））；
}
}
}

这将给您一个错误：

除非您有一个getter和setter，否则不能在computed上设置v模型

我不确定如果用户编辑该字段，您希望发生什么，但是您应该将其定义为一个值，并且不使其可编辑，或者为应该发生的事情定义规则

下面是一个使用setter从

Max

更新中计算

举重的示例

new Vue({
  el: "#app",
  data() {
    return {
      weightLifted: '',
      reps: '',
    }
  },
  computed: {
    result: {
      get() {
        return this.weightLifted * (1 + (this.reps / 30));
      },
      set(newVal) {
        this.weightLifted = newVal / (1 + (this.reps / 30))
      }
    }
  }
})

fiddle link
写入控制台的错误具体是什么？使用修饰符=
v-model.number
会更好，
type=“number”
会使输入只允许数字和相关数学语法，但值仍然是一个字符串。我发现两者都不完美，但两者都比没有好。理想的解决办法是用手表消毒