为了实现在 el-select 点击后加载数据,你可以按照以下步骤进行操作: 为el-select 组件添加点击事件监听: 由于el-select 组件没有直接的点击事件,但你可以通过监听其内部的 el-select-dropdown 的显示状态来间接判断用户是否点击了下拉框。这通常可以通过自定义指令或监听组件的特定事件(如 visible-change)来实现。不过...
</el-select> </el-form-item> </el-form> </div> </template> <script> import { res } from './data.js' import selectLoadMore from '@/layout/mixin/selectLoadMore' import PinyinMatch from 'pinyin-match' export default { name: 'SelectScroll', components: { listScroll }, mixins: [sele...
el-select是 Element UI 的一个组件,用于选择数据。如果你想要在滚动到底部时加载更多数据,你可以结合监听滚动事件和请求数据的方法来实现。 以下是一个简单的示例,展示如何使用el-select在滚动到底部时加载更多数据: HTML: html复制代码 <template> <el-select v-model="value"multiple placeholder="请选择"@...
(1).创建directive.js,自定义指令el-select-loadmore,按需加载数据: constinstall=function(Vue){// el-select组件数据过多,使用翻页加载数据指令Vue.directive('el-select-loadmore',{bind(el,binding){constSELECTWRAP_DOM=el.querySelector('.el-select-dropdown .el-select-dropdown__wrap');SELECTWRAP_DOM....
<el-select :popper-append-to-body="false" ... 这样的话,我们可以在自定义指令的钩子中,可以直接使用el.querySelector(xxx)去选中下拉框的选项弹出层了。就不用使用document.querySelector(xxx) 因为,若是嵌入到body层,若是同一个页面,有多个el-select就不太好控制管理了 ...
script directives:{//注意:这个是写到data外面'el-select-loadmore':{bind(el,binding){constSELECTWRAP_DOM=el.querySelector('.el-select-dropdown .el-select-dropdown__wrap')SELECTWRAP_DOM.addEventListener('scroll',function(){constcondition=this.scrollHeight-this.scrollTop<=this.clientHeightif(condition...
您可以使用element-ui的el-select组件的loadMore方法来实现下拉加载数据。当您点击下一页时,loadMore方法会被调用,然后您可以在回调函数中判断是否是最后一页。如果是最后一页,则不执行加载操作。 如果您想要实现无限滚动,可以使用element-ui的el-select组件的loadMore方法,并在回调函数中判断是否是最后一...
// el-select里加入loadmore<el-selectv-loadmore="loadmore"></el-select> 3、分页参数 pageData:{current:1,// 页码size:10 // 条数},total:0 4、事件方法(methods) loadmore(){console.log('我滑动加载了');// 请求后端数据并加入分页...}...
el-select下拉加载数据判断最后一页? 郭晟玮 1121978 发布于 2022-11-16 北京 获取数据方法: getTitlePage() { getTitlePage({ pageNum: this.formData.pageNum, pageSize: this.formData.pageSize, }).then((res) => { if (!res) return; this.formData.total = res.total; this.totalPage = res....
Element UI el-select 从远端加载数据 最近做项目用到了Element UI的el-select组件,我的需求是想要从远端服务器直接加载options,加载的时候有个loading,但是Element UI文档只给出了从远端搜索的案例,用起来不方便,于是经过一番摸索,找到了一个解决方案,可以通过el-select自带的visible-change事件来实现,这样用户体验...