使用 vue 计算数字

Question

我对 vueJS 真的很陌生。

我尝试获取两个输入值，将它们相加并显示结果。我发现它真的是连线的，因为当数字 1 减去数字 3，或数字 1 乘以数字 2，或数字 1 除以数字 2 时，计算一切正常。但是，当 number1 加 number2 时，它不起作用，并且似乎将两个 str 相加（例如：1 + 2 = 12）。

这里发生了什么？我怎样才能得到 number1 + number2 的结果

请帮忙

<div id="app">

        <input type="number" name="number1" v-on:input= "update_number1">
        <p>{{ number1 }}</p>
        <input type="number" name="number2" v-on:input= "update_number2">
        <p>{{ number2 }}</p>

        <hr>
        <p>{{ result() }}</p>

</div>

new Vue({
  el: '#app',
  data: {
    number1: 0,
    number2: 0,
  },
  methods: {
    update_number1: function (event) {
      this.number1 = event.target.value;
    },
    update_number2: function (event) {
      this.number2 = event.target.value;
    },
    result: function () {

      return this.number1 + this.number2;
    },

  },
});

Answer 1

这更可能是 javascript 问题而不是 vue 问题。

如果你想添加两个数字，你可以使用parseInt()函数：

result: function () {
  return parseInt(this.number1) + parseInt(this.number2);
}