vue element-ui elementUi 邮箱自动补全 邮箱自动填充

在这里插入图片描述

<el-autocomplete
    v-model="form.user.email"
    :fetch-suggestions="querySearchEmail"
    :trigger-on-focus="false"
    placeholder="接收邮件邮箱"
>
</el-autocomplete>
// 邮箱自动填充后缀名
querySearchEmail(queryString, callback) {
    const emailList = [
        { value: '@qq.com' },
        { value: '@126.com' },
        { value: '@163.com' },
        { value: '@sina.com' },
        { value: '@21cn.com' },
        { value: '@sohu.com' },
        { value: '@yahoo.com.cn' },
        { value: '@tom.com' }, 
        { value: '@etang.com' },
        { value: '@eyou.com' },
        { value: '@56.com' },
        { value: '@x.cn' },
        { value: '@chinaren.comsogou.com' },
        { value: '@citiz.com' },
    ]
    let results = []
    let queryList = []
    emailList.map(item => {
        queryList.push({ value: queryString.split('@')[0] + item.value })
    })
    results = queryString ? queryList.filter(this.createFilter(queryString)) : queryList;
    callback(results);            
},

// 邮箱填写过滤
createFilter(queryString) {
    return (item) => {
        return (item.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
    };
},
  • 4
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值