Question

我正在尝试创建一个字段，用户可以在其中输入多个有效的电子邮件地址。点击“ Enter”键，最后输入的电子邮件将被验证是否为有效电子邮件。我尝试使用下面提供的内容来做到这一点，但是我对Vue JS或Vuetify JS的了解不足。我认为验证电子邮件地址的方法不正确（!(v => /.+@.+/.test(v))，我只是从Vuetify JS网站的Form示例中获取的。我想问-在这种情况下验证电子邮件的正确方法是什么？

这是我的代码：

<template>
    <v-combobox v-model="chips"
                label="Emails"
                chips
                clearable
                solo
                :rules="emailRules"
                multiple>
        <template v-slot:selection="data">
            <v-chip :selected="data.selected"
                    close
                    @input="remove(data.item)">
                <strong>{{ data.item }}</strong>&nbsp;
            </v-chip>
        </template>
    </v-combobox>
</template>

<script>
    export default {
        data() {
            return {
                chips: [],
                emailRules :[
                    v => {
                        if (!v || v.length < 1)
                            return 'Input is required';
                        else if (v.length > 0) {
                            for (let i = 0; i < v.length; i++) {
                                if ((i == v.length-1) && !(v => /.+@.+/.test(v)))
                                    return 'Invalid email';
                            }
                        }
                        else return true;
                    }
                ]
            }
        },

        methods: {
            remove(item) {
                this.chips.splice(this.chips.indexOf(item), 1)
                this.chips = [...this.chips]
            }
        }
    }
</script>

非常感谢！

Answer 1

我是这样做的：

if (!(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,24}))$/.test(v[i]))) {
     return 'Invalid email';
}

现在可以使用了。

验证芯片内的电子邮件地址

1 个答案: