AntDesingVue select下拉框中数据量过多，响应慢。使用popupScroll，下拉加载更多

在做公司的项目时，需要将行政区与区块联系下拉，导致加载的数据过多，页面响应慢，因此可以考虑使用分页的方式，用户在下拉到底部时加载更多的数据，一直到数据加载完。

ant design for vue 的select提供了popupScroll方法

具体的实现如下

　　<a-select 
        style="width: 100%" 
        show-search
        placeholder="请选择"
        search-placeholder="请选择"
        :dropdown-style="{ maxHeight: '240px', overflow: 'auto' }"
        :value="value" 
        @change="onChange" 
        @search="searchChange"
        @popupScroll="popupScroll"
        :filter-option="false"
        not-found-content="暂无数据"
    >
        <a-select-option v-for="item in treeData" :key="item.code" :data="item" :value="item.code" :title=" item.pathName">
            {{ item.pathName}}
        </a-select-option>
    </a-select>

　　

pageSize: 10, // 分页

pageNumber: 1,

        getListDataCode(code = '') { // 获取树节点
            let self = this;
            this.$post(self.$api.getCompanyList, 
                { 
                    code: code, 
                    systemCode: 'SYSTEM',
                    fullName:self.searchName,
                    pageNumber: this.pageNumber,
                    pageSize: this.pageSize,

                }).then((res) => {
                if(res.code - 0 === 200) {
                    const resData = (res.data && res.data) || []
                    this.pages= res.data.pages;
                    if(this.treeData.length <= resData.total){
                        this.treeData.push(...resData.records);
                    }
                    
                    
                }
            })
        },
        // 文本框的值变化是
        searchChange(searchValue){
            this.searchName = searchValue
            if(this.searchName){
                this.treeData = []
                this.pageNumber = 1;
                this.getListDataCode(this.parentCode)
            }
        },
        // 选中时调用
        onChange(value,e){
            this.searchName = value;
            let data = e && e.data && e.data.attrs && e.data.attrs.data
            this.$emit('select', {...data, value, name: data.pathName})
        },
        popupScroll(e){
            const {target} = e;
            const scrllHeight = target.scrollHeight - target.scrollTop;
            const clientHeight = target.clientHeight;
            // 下拉框不下拉的时候
            if(scrllHeight ===0 && clientHeight ===0){
                this.pageNumber = 1;
            } else if(scrllHeight - clientHeight == 0){ // 下拉到底部时
                if(this.pageNumber < this.pages){
                    // 如果滑到底部，则加载下一页
                    this.pageNumber++ 
                    this.getListDataCode(this.parentCode)
                }
            }
            
        }