vue简单的表单操作

VUE的表单操作

        
          
        
        
          
        

确 定

vue表单验证通过prop属性对应input中的v-modle`

addUser() {
      this.$refs.addFormRef.validate(async valid => {
        if (!valid) return valid
        const { data: result } = await this.$http.post('users', this.addForm)
        if (result.meta.status !== 201) this.$message.error('添加用户失败！')
        this.$message.success('添加成功')
        this.addDialogVisible = false
        // 刷新用户列表
        this.getUserList()
      })
    }
    // 重置表单的数据
    editDialogClosed() {
      this.$refs.editFormRef.resetFields()
    }
    ```
    **通过validate方法对表单进行预校验，返回的参数valid是一个boolean值，通过$refs的属性方法resetFields()重置表单数据**