1.下載依賴包
$ npm install --save vue-mugen-scroll
2.哪個(gè)頁(yè)面需要到,就在哪個(gè)頁(yè)面引用
import MugenScroll from 'vue-mugen-scroll';
3.代碼如下
<template>
<div class="div-table" ref="noCharge">
<div class="table-loading">
<el-table
:data="tableData"
border
style="width: 100%">
..........
<el-table-column
align="center"
label="金額">
<template slot-scope="scope">
{{scope.row.money | moneyFil}}
</template>
</el-table-column>
</el-table>
</div>
<mugen-scroll :handler="fetchData" :should-handle="!loading" scroll-container="noCharge">
<!-- <loading :hasLoading="hasLoading"></loading> -->
loading
</mugen-scroll>
</div>
</template>
<script>
.......
data(){ return{ loading:false, } },
methods:{
fetchData() {
console.log(1212)
this.loading = true;
// 此處寫(xiě)你請(qǐng)求數(shù)據(jù)的代碼
//this.loading = false
for(var i=0;i<15;i++){
this.tableData.push({
.........
})
}
this.loading = false;
},
}
.........
</script>
//注意<div class="div-table" ref="noCharge">該div的高度一定預(yù)先設(shè)置好