<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
>
<!--<div class="item" v-for="item of list" @click="handlerDetail">-->
<div class="item" v-for="item of list">
<img :src="item.stationPic" class="item_img">
<div class="item_middle font_duo">
<p class="item_Name">{{item.stationName}}</p>
<div class="item_middle_middle">
<img src="./img/icon_position@2x.png" class="item_icon">
<span class="item_Name_span font_duo">{{item.location}}</span>
</div>
<div>
<span class="item_OilsType"><span>95</span>
<span class="item_Moeny">¥<span>6.66</span></span>
<span class="item_YMoeny">优惠<span>0.5</span>元</span>
</div>
</div>
<span class="item_kilmite">1.55km</span>
</div>
</van-list>
复制代码
onLoad() {
let OilsData={
latitude:this.latitude,
longitude:this.longitude
}
// 异步更新数据
setTimeout(() => {
this.$commonApi.getOilsList(OilsData).then(res=>{
// 获取到的res数据是组合查询的所有结果
let Data=res.data
let DataItem=[Data.slice(5*this.index,5*(this.index+1))]
for (let i=0;i<DataItem.length;i++){
for (let j=0;j<DataItem[i].length;j++){
this.list.push(DataItem[i][j])
}
}
this.index++ // 页数递增
// 加载状态结束
this.loading = false;
// 数据全部加载完成
if (this.list.length ===Data.length) {
this.finished = true;
}
})
}, 500);
},
复制代码
