一神得，新增loadmore.js文件
export default {
bind(el, binding) {
// 獲取element-ui定義好的scroll盒子
const SELECTWRAP_DOM = el.querySelector(
'.el-select-dropdown .el-select-dropdown__wrap'
)
if (!SELECTWRAP_DOM) {
return
}
SELECTWRAP_DOM.addEventListener('scroll', function () {
const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight
if (CONDITION) {
console.log(binding)
binding.value()
}
})
}
}
二撞鹉，新建指令統(tǒng)一導出的文件redirect.js
import loadmore from './loadmore'
const install = function (Vue) {
Vue.directive('loadmore', loadmore)
}
if (window.Vue) {
window['loadmore'] = loadmore
Vue.use(install) // eslint-disable-line
}
export default install
三逆日，在main.js注冊使用
import directive from './directive' //directive
Vue.use(directive)
四，在頁面使用
<el-form-item label="標簽">
<el-select
v-model="form.tagText"
style="width: 800px"
placeholder="請選擇"
clearable
multiple
@change="bindChange"
value-key="id"
v-loadmore="loadMore"
>
<el-option
v-for="item in tagList"
:key="item.id"
:label="item.name"
:value="item"
class="xxx"
>
</el-option>
</el-select>
</el-form-item>
五奠滑，在loadMore方法中具體實現請求
