1<el-select filterable :filter-method="filterMethod" @visible-change="visibleChange" >2</el-select>34//搜索5filterMethod(query) {6if(query !== '') {7this.$refs.virtualList.scrollToIndex(0);//滚动到顶部8setTimeout(() =>{9this.selectArr =this.selectData.data.filter(item =>{10retur...
data-component=“itemComponent” 就是抽离中的el-option组件 keeps=“20” 渲染的个数 extra-props 值为对象,可以传入自定义属性进去 高度设置 .virtualselect { // 设置最大高度 &-list { max-height:245px; overflow-y:auto; } .el-scrollbar .el-scrollbar__bar.is-vertical { width: 0; } } 原...
个人更加喜欢像下面这样的组件设计: <el-select v-model="value" placeholder="Select"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" :disabled="item.disabled" /> </el-select> 显性的子组件和v-for,以及直观的key值。 优化后的表现 结果显而...
VirtualSelect.vue <template> <div> <el-select popper-class="virtualselect" class="virtual-select-custom-style" :value="defaultValue" filterable :filter-method="filterMethod" default-first-option clearable :placeholder="placeholder" :disabled="disabled" :multiple="isMultiple" :allow-create="allowCrea...