element-ui + vee-validate 点击提交按钮怎么触发验证,然后提交?

用element的验证方式 无法验证 代码如下:

<template>
    <el-form label-position="right" label-width="80px" 
:model="formData" ref="form">
        <el-form-item label="邮箱" :error="errors.first('email')">
            <el-input v-model="formData.email" name="email" data-vv-as="邮箱" v-validate="'required|email'"></el-input>
        </el-form-item>
        <el-form-item label="密码" :error="errors.first('email')">
            <el-input type="password" v-model="formData.password" data-vv-as="密码" v-validate="'required'"></el-input>
        </el-form-item>
        <el-form-item>
            <el-checkbox v-model="formData.remember">记住密码</el-checkbox>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click.prevent="login('form')">立即登录</el-button>
        </el-form-item>
    </el-form>
</template>
<script>
    export default {
        data() {
            return {
                formData: {
                    email: '',
                    password: '',
                    remember: true
                }
            }
        },
        methods: {
            login(form) {
                this.$refs[form].validate(result => {
                    console.log(result)
                    if (result) {
                        axios.post('api/login', this.formData).then(response => {
                            this.$router.push({name: 'index'})
                        });
                    }
                });
            }
        }
    }
</script>

用vee的验证方式 也无法验证 代码如下:

<template>
    <el-form label-position="right" label-width="80px" 
:model="formData" data-vv-scope="form">
        <el-form-item label="邮箱" :error="errors.first('email')">
            <el-input v-model="formData.email" name="email" data-vv-as="邮箱" v-validate="'required|email'"></el-input>
        </el-form-item>
        <el-form-item label="密码" :error="errors.first('email')">
            <el-input type="password" v-model="formData.password" data-vv-as="密码" v-validate="'required'"></el-input>
        </el-form-item>
        <el-form-item>
            <el-checkbox v-model="formData.remember">记住密码</el-checkbox>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" @click.prevent="login('form')">立即登录</el-button>
        </el-form-item>
    </el-form>
</template>
<script>
    export default {
        data() {
            return {
                formData: {
                    email: '',
                    password: '',
                    remember: true
                }
            }
        },
        methods: {
            login(scope) {
               this.$validator.validateAll(scope).then((result) => {
                    console.log(result)
                    if (result) {
                        axios.post('api/login', this.formData).then(response => {
                            this.$router.push({name: 'index'})
                        });
                    }
                });
            }
        }
    }
</script>

到底怎么才能在提交的时候触发验证?

JellyBool
修改的评论也不能少于六个字哦!
UpGod 回复 JellyBool
修改的评论也不能少于六个字哦!
hcweb 回复 JellyBool
修改的评论也不能少于六个字哦!
JellyBool 回复 hcweb
修改的评论也不能少于六个字哦!
UpGod
修改的评论也不能少于六个字哦!