用iview 寫 帶分頁的下拉框
阿新 • • 發佈:2020-12-30
需求
Html部分
<Select v-model="name" clearable filterable @on-change="onChangeName" class="content_select2" > <Option v-for="item in nameList" :value="item.id" :key="item.id">{{ item.name }}</Option> <Page :total="totalName" size="small" show-total :page-size="pageSizeName" :current="currentPageName" @on-change="handlePageName" /> </Select>
js部分
data() { return { name: '', nameList: [], // 機構列表 totalName: 0, // 機構總數 pageSizeName: 10, // 機構分頁 currentPageName: 1 // 機構分頁 } }, methods: { onChangeType (val) { this.typeData = val this.handlePageName(1) }, async handlePageName (val) { // 掉介面 const { data, count } = await organizationController.cooperativeOrgani.getCooperative({ type: this.typeData, pageSize: this.pageSizeName, pageNum: val }) if (data) { this.nameList = data || [] this.totalName = count } else { this.nameList = [] this.totalName = 0 } }, }
就是把下拉框裡面加了個分頁,很簡單的東西