vue3 el-input-number 数据计算

在Vue 3中，可以使用`el-input-number`组件来进行数据计算。`el-input-number`是一个基于Element UI的组件，用于输入数字和进行增减操作。

首先，需要在Vue组件中引入`el-input-number`组件：

<template>
  <div>
    <el-input-number v-model="num1"></el-input-number>
    <el-input-number v-model="num2"></el-input-number>
    <button @click="add">Add</button>
    <p>Result: {{ result }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      num1: 0,
      num2: 0,
      result: 0
    };
  },
  methods: {
    add() {
      this.result = this.num1 + this.num2;
    }
  }
};
</script>

在上述代码中，我们使用了两个`el-input-number`组件来输入两个数字，并通过`v-model`指令将输入的值绑定到`num1`和`num2`变量上。然后，我们使用一个按钮来触发计算方法`add`，并将计算结果赋值给`result`变量。最后，通过插值表达式`{{ result }}`将结果显示出来。

这样，当用户输入数字并点击"Add"按钮时，Vue会自动计算并更新计算结果。