一个很小的控件，就是录入时自动补全常用的后缀，很实用。
实现原理：
基于<el-autocomplete>开发，最核心的是
:fetch-suggestions="querySearchEmail"
@select="onChange"
@blur="onChange"
// 邮箱自动填充后缀名
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);
},
onChange() {
this.$emit("update:content", this.email);
}
用法：
import emailInput from "@/qlmcomponents/inputControl/emailInput"
components: { emailInput},
<emailInput :content.sync="formData.contactEMail"></emailInput>