vue 网络卡顿重复提交el-form表单

为了避免vue中el-form表单的网络卡顿和重复提交，可以采取以下措施：
1. 在el-form表单中添加ref属性，用于在JavaScript中访问表单。
2. 在JavaScript中定义一个变量，用于存储表单是否正在提交的状态。
3. 在表单提交前，检查表单是否正在提交，如果是，则不执行提交操作。
4. 在表单提交后，将表单提交状态设置为false，并清空表单数据。

下面是一个示例代码：

<template>
  <el-form ref="myForm" :model="formData" label-width="80px">
    <el-form-item label="姓名">
      <el-input v-model="formData.name"></el-input>
    </el-form-item>
    <el-form-item label="年龄">
      <el-input v-model.number="formData.age"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submitForm">提交</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      formData: {
        name: '',
        age: 0
      },
      isSubmitting: false
    }
  },
  methods: {
    submitForm() {
      if (this.isSubmitting) {
        return
      }
      this.isSubmitting = true
      this.$refs.myForm.validate(valid => {
        if (valid) {
          // 表单验证通过，执行提交操作
          // 这里可以使用axios等工具发送表单数据到后端
          // 提交成功后，将isSubmitting设置为false，并清空表单数据
          setTimeout(() => {
            this.isSubmitting = false
            this.$refs.myForm.resetFields()
          }, 2000)
        } else {
          this.isSubmitting = false
        }
      })
    }
  }
}
</script>