调接口 （未分类）（分页）

<template>
<view class="body">
<div class="productList_contact_fl ">
<ul>
<li :class="{cur:navIndex==index}" v-for="(item,index) in lists" :key="index"
@click="prodectList(index,item.goodsClassId,1)">{{item.chineseName}}</li>
</ul>
</div>
<!-- 列表 -->
<view class="">


<view class="liebiao_view" v-for="(item,index) in prodectLists" >
<!-- 图片 -->
<view class="view_imga fl">
<image src="../../../static/index/index01.png"></image>
</view>

<!-- 产品名称 -->
<view class="chanpin_view fl">
<!-- 产品名称 -->
<view class="">
{{item.brandName}}
</view>

<!-- 规格 -->
<view class="">
{{item.purchaseSpec}}
</view>
<!-- 编号 -->
<view class="">
{{item.purchaseSpec}}
<text id="text_bh">{{item.retailPrice}}</text>



</view>

</view>

</view>

</view>
<uni-load-more :status="status" :content-text="contentText" />
</view>
</template>

<script>
export default {
data(){
return{
page: 0,
size: 5,
navIndex:'',
prodectLists:[],
lists:{},
status: 'more',
contentText: {
contentdown: '查看更多',
contentrefresh: '加载中',
contentnomore: '没有更多'
}

}
},
created(){
this.getlist()
},
onReachBottom(){
this.prodectList(this.lists[this.navIndex].goodsClassId,this.navIndex)

// this.prodectList(thsi.lists[this.navIndex].goodsClassId,this.navIndex)
},
methods:{
getlist(){
this.request({
url:'/goods/appGoodsClass/listAll',
method:'GET',
data:{}
}).then(res=>{
// console.log(res)
res.data.unshift({
goodsClassId: 0,
chineseName: '未分类'
})
this.lists=res.data
})
},
prodectList(index,goodsClassId,page = null){
this.navIndex=index;

if(page){
this.page=page;
this.prodectLists = [];
this.status='more';
}else{
page++
}

// let postData={
// current:this.size,
// page:this.page
// }
let postData = {
current: this.page,
size: this.size
}
if(index !=0){
postData.goodsClassId=goodsClassId
}
this.status='loading'
this.request({
url:'/goods/appGoods/page',
method:'GET',
data:postData
}).then(res=>{
console.log('aa')
console.log(res)
this.prodectLists= this.prodectLists.concat(res.data.records)
})
}
}
}
</script>

<style>

.cur {
background: #1081c7;
/* border: 1px solid #e6e6e6; */
color: #fff;
font-size: 36upx;
}
.view_imga{
width: 200rpx;
height:200rpx;
margin-top: 50rpx;
border: 1px solid #F0AD4E;
}
.view_imga image{
width: 200rpx;
height: 200rpx;
}
.liebiao_view:after{
content:"";
display:table;
clear:both;
}
.liebiao_view{
width: 100%;
/* border: 1rpx solid #DD524D; */
}
.chanpin_view view{
width: 500rpx;
margin-top: 50rpx;
line-height: 25rpx;
color: #999999;
margin-left: 19rpx;
/* border: 2rpx solid #4CD964; */
}
#text_bh{
float: right;
}
.cur {
background: #1081c7;
/* border: 1px solid #e6e6e6; */
color: #fff;
font-size: 36upx;
}
</style>