vue - elemebt-admin 移动端select远程搜索软键盘无法弹出

试了网上大部分方法,体验感不好,即使软键盘出来。搜索需要再空格一下。于是转为input远程搜索 el-autocomplete

                <el-autocomplete v-model.trim="cidWords" :fetch-suggestions="searchCustomer" @select="selectCustomer" @clear="clearInput" clearable placeholder="客户名/简称" class="search-select left-btn min-left">
                    <template slot-scope="{ item }">
                        <div>{{ item.c_name }}({{ item.c_sname }})</div>
                    </template>
                </el-autocomplete>


        //搜索客户
        searchCustomer(query, cb) {
            if (query !== '') {
                this.cid = '';
                this.cidWords = '';
                this.customerss = [];
                getCustomer({ keyword: query, show: 1, comid: this.comid }).then((res) => {
                    const { list } = res;
                    this.customers = list;
                    if (this.customers.length == 0) {
                        this.customers.push({ cid: '', c_name: '暂无数据', c_sname: '无' });
                    }
                    cb(this.customers);
                });
            } else {
                this.customers = [];
                this.customers.push({ cid: '', c_name: '暂无数据', c_sname: '无' });
                cb(this.customers);
            }
        },
        //确定客户
        selectCustomer(data) {
            const { cid, c_name, c_sname } = data;
            if (cid != '') {
                this.cid = cid;
                this.cidWords = c_name + '(' + c_sname + ')';
            } else {
                this.cid = '';
                this.cidWords = '';
            }
        },
        //清空客户
        clearInput() {
            this.cid = '';
            this.cidWords = '';
            this.customers = [];
        },
posted @ 2021-03-29 17:52  gggggggxin  阅读(480)  评论(0编辑  收藏  举报