第二页JSON返回只有两条数据
WXML:
<view class="container">
<view class="arrow">
<view class="arrow-left" bindtap='Lclickimg'>
<image src='../images/arrow-left.png' style='width:30px;height:16px;margin-left:40%;' ></image>
</view>
<picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}" >
<view class="picker" >
第 {{array[index]}} 页
</view>
</picker>
<view class="arrow-right" bindtap='Rclickimg'>
<image src='../images/arrow-right.png' style='width:30px;height:16px;margin-left:44%;' ></image>
</view>
</view>
<navigator class='nav' url='/pages/upload/upload?tname={{item.tname}}&tcontent={{item.tcontent}}&tid={{item.tid}}&price={{item.price}}&place={{item.place}}' wx:for="{{items}}" wx:key>
<view class='item'>
<view class='item-title'>{{item.tname}}</view>
<view class='item-content'>{{item.tcontent}}</view>
<view class='item-bottom'>
<view>{{item.tm}}</view>
<view>{{item.place}} </view>
<view>{{item.tid}}</view>
</view>
<view class='item-price'>
<view class='price'>
{{item.price/100}}元/票
</view>
</view>
</view>
</navigator>
</view>
JS:
onShow: function() {
var that = this;
var index=that.data.index;
wx.request({
url: 'http://localhost:8080/VoteSystemServer/User/CountRow',
data:{
flag:1
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success:function(res){
var arr=res.data;
var array = new Array();
for (let i = 0; i < arr.pageCount;i++){
array[i]=i+1;
}
that.setData({
array:array
})
}
});
//待审核页，传入 that.data.index
wx.request({
url: 'http://localhost:8080/VoteSystemServer/User/doFindAll',
data: {
Type: 'status',
SearchName: '审核通过',
sign: '=',
Page: parseInt(index) + parseInt(1)
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success: function(res) {
var arr = res.data;
for (let i = 0; i < arr.length ; i++) {
var tid = arr[i].tid;
var tname = arr[i].tname;
var tcontent = arr[i].tcontent;
var tnumber = arr[i].tnumber;
var name = arr[i].name;
var phone = arr[i].phone;
var wxname = arr[i].wxname;
var tm = arr[i].tm;
var status = arr[i].status;
var price = arr[i].price;
var url = arr[i].url;
var province = arr[i].province;
var city = arr[i].city;
var region = arr[i].region;
var place = province + city + region;
var tid_data = "items[" + i + "].tid"
var tname_data = "items[" + i + "].tname"
var tcontent_data = "items[" + i + "].tcontent"
var tnumber_data = "items[" + i + "].tnumber"
var name_data = "items[" + i + "].name"
var phone_data = "items[" + i + "].phone"
var wxname_data = "items[" + i + "].wxname"
var tm_data = "items[" + i + "].tm"
var status_data = "items[" + i + "].status"
var price_data = "items[" + i + "].price"
var url_data = "items[" + i + "].url"
var province_data = "items[" + i + "].province"
var city_data = "items[" + i + "].city"
var region_data = "items[" + i + "].region"
var place_data = "items[" + i + "].place"
that.setData({
id: i,
[tid_data]: tid,
[tname_data]: tname,
[tcontent_data]: tcontent,
[tm_data]: tm,
[price_data]: price,
[tid_data]: tid,
[place_data]: place,
[city_data]: city,
[province_data]: province,
[region_data]: region
})
}
},
fail: function(res) {},
complete: function(res) {},
})
}
bindPickerChange: function (e) {
console.log('picker发送选择改变，携带值为', e.detail.value);
this.setData({
index: e.detail.value
});
wx.startPullDownRefresh();
},
Lclickimg: function (e) {
var that = this;
var index = that.data.index;
if (index > 0) {
that.setData({
index: parseInt(index) - parseInt(1)
})
console.log("索引:" + that.data.index);
wx.startPullDownRefresh();
}
},
Rclickimg: function (e) {
var that = this;
var len = that.data.array.length
var index = that.data.index;
if (index < len - 1) {
that.setData({
index: parseInt(index) + parseInt(1)
})
console.log("索引:" + that.data.index);
wx.startPullDownRefresh();
}
},
onPullDownRefresh: function () {
this.onLoad();
var that = this;
var index = that.data.index;
wx.request({
url: 'http://localhost:8080/VoteSystemServer/User/CountRow',
data: {
flag: 1
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success: function (res) {
var arr = res.data;
var array = new Array();
for (let i = 0; i < arr.pageCount; i++) {
array[i] = i + 1;
}
that.setData({
array: array
})
}
});
//待审核页，传入 that.data.index
wx.request({
url: 'http://localhost:8080/VoteSystemServer/User/doFindAll',
data: {
Type: 'status',
SearchName: '审核通过',
sign: '=',
Page: parseInt(index) + parseInt(1)
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success: function (res) {
var arr = res.data;
for (let i = 0; i < arr.length; i++) {
var tid = arr[i].tid;
var tname = arr[i].tname;
var tcontent = arr[i].tcontent;
var tnumber = arr[i].tnumber;
var name = arr[i].name;
var phone = arr[i].phone;
var wxname = arr[i].wxname;
var tm = arr[i].tm;
var status = arr[i].status;
var price = arr[i].price;
var url = arr[i].url;
var province = arr[i].province;
var city = arr[i].city;
var region = arr[i].region;
var place = province + city + region;
var tid_data = "items[" + i + "].tid"
var tname_data = "items[" + i + "].tname"
var tcontent_data = "items[" + i + "].tcontent"
var tnumber_data = "items[" + i + "].tnumber"
var name_data = "items[" + i + "].name"
var phone_data = "items[" + i + "].phone"
var wxname_data = "items[" + i + "].wxname"
var tm_data = "items[" + i + "].tm"
var status_data = "items[" + i + "].status"
var price_data = "items[" + i + "].price"
var url_data = "items[" + i + "].url"
var province_data = "items[" + i + "].province"
var city_data = "items[" + i + "].city"
var region_data = "items[" + i + "].region"
var place_data = "items[" + i + "].place"
that.setData({
id: i,
[tid_data]: tid,
[tname_data]: tname,
[tcontent_data]: tcontent,
[tm_data]: tm,
[price_data]: price,
[tid_data]: tid,
icon: '',
[place_data]: place,
[city_data]: city,
[province_data]: province,
[region_data]: region
})
}
},
fail: function (res) { },
complete: function (res) {wx.stopPullDownRefresh() },
})
},
JSON返回值:第一页
[
{
"city": "长沙市",
"id": 24,
"price": 30,
"province": "湖南省",
"region": "芙蓉区",
"status": "审核通过",
"tcontent": "帮忙投5号，每用户可投3票",
"tid": "SGB2018111900001",
"tm": "2018-11-19 08:27:36",
"tname": "测试1901",
"tnumber": 2,
"url": "http://931248395.ax.nofollow.51wtp.com/index.php/toupiao/h5/detail?id=1910056&vid=931248395&from=timeline",
"wxname": "oRPyJ5TTK7RR8XmwxJkVMuyg5WFA"
},
{
"city": "武汉市",
"id": 23,
"price": 10,
"province": "湖北省",
"region": "黄陂区",
"status": "审核通过",
"tcontent": "测试",
"tid": "SGB2018111700005",
"tm": "2018-11-17 21:54:31",
"tname": "测试1703",
"tnumber": 1,
"url": "https://mp.weixin.qq.com/s/N7hU912MFI7AoQsqnn0QHA",
"wxname": "oRPyJ5dnkYwOs_4Wn1DwipZ108Fk"
},
{
"city": "武汉市",
"id": 22,
"price": 15,
"province": "湖北省",
"region": "新洲区",
"status": "审核通过",
"tcontent": "投37",
"tid": "SGB2018111700004",
"tm": "2018-11-17 21:49:58",
"tname": "测试1702",
"tnumber": 2,
"url": "http://chm.dachuw.com/aixin/plugin.php?id=tom_weixin_vote&mod=phb&vid=4&nav=1&from=timeline&isappinstalled=0",
"wxname": "oRPyJ5TTK7RR8XmwxJkVMuyg5WFA"
},
{
"city": "武汉市",
"id": 21,
"price": 30,
"province": "湖北省",
"region": "武昌区",
"status": "审核通过",
"tcontent": "帮忙投第四，你奋斗的样子，真美！",
"tid": "SGB2018111700003",
"tm": "2018-11-17 21:19:10",
"tname": "17测试",
"tnumber": 3,
"url": "https://mp.weixin.qq.com/s/7BEFvIjN9licgQJ85sbUbA",
"wxname": "oRPyJ5dnkYwOs_4Wn1DwipZ108Fk"
},
{
"city": "武汉市",
"id": 20,
"price": 30,
"province": "湖北省",
"region": "江夏区",
"status": "审核通过",
"tcontent": "4",
"tid": "SGB2018111700002",
"tm": "2018-11-17 09:00:06",
"tname": "4",
"tnumber": 1,
"url": "http://wx5443.vshangtong.com/?ac=votemb&tid=8377&id=3512&mbid=511975&from=groupmessage",
"wxname": "oRPyJ5U-XHjNC0etLJpjcpg2L96g"
},
{
"city": "武汉市",
"id": 19,
"price": 30,
"province": "湖北省",
"region": "江夏区",
"status": "审核通过",
"tcontent": "3",
"tid": "SGB2018111700001",
"tm": "2018-11-17 00:01:34",
"tname": "3",
"tnumber": 1,
"url": "http://wx5443.vshangtong.com/?ac=votemb&tid=8377&id=3512&mbid=511975&from=groupmessage",
"wxname": "oRPyJ5U-XHjNC0etLJpjcpg2L96g"
},
{
"city": "武汉市",
"id": 18,
"price": 30,
"province": "湖北省",
"region": "江夏区",
"status": "审核通过",
"tcontent": "2",
"tid": "SGB2018111600004",
"tm": "2018-11-16 23:46:34",
"tname": "2",
"tnumber": 3,
"url": "http://wx5443.vshangtong.com/?ac=votemb&tid=8377&id=3512&mbid=511975&from=groupmessage",
"wxname": "oRPyJ5U-XHjNC0etLJpjcpg2L96g"
},
{
"city": "武汉市",
"id": 17,
"price": 30,
"province": "湖北省",
"region": "江夏区",
"status": "审核通过",
"tcontent": "1",
"tid": "SGB2018111600003",
"tm": "2018-11-16 22:26:52",
"tname": "1",
"tnumber": 1,
"url": "http://wx5443.vshangtong.com/?ac=votemb&tid=8377&id=3512&mbid=511975&from=groupmessage",
"wxname": "oRPyJ5U-XHjNC0etLJpjcpg2L96g"
},
{
"city": "undefined",
"id": 13,
"price": 30,
"province": "undefined",
"region": "undefined",
"status": "审核通过",
"tcontent": "测试",
"tid": "SGB2018111600002",
"tm": "2018-11-16 20:25:24",
"tname": "测试",
"tnumber": 1,
"url": "http://wx5443.vshangtong.com/",
"wxname": "undefined"
},
{
"city": "undefined",
"id": 12,
"price": 30,
"province": "undefined",
"region": "undefined",
"status": "审核通过",
"tcontent": "123456",
"tid": "SGB2018111600001",
"tm": "2018-11-16 19:55:04",
"tname": "特别的",
"tnumber": 3,
"url": "http://wx5443.vshangtong.com/index.php",
"wxname": "undefined"
}
]
JSON返回值:第二页
[
{
"city": "武汉市",
"id": 9,
"price": 30,
"province": "湖北省",
"region": "黄陂区",
"status": "审核通过",
"tcontent": "测试",
"tid": "SGB2018110800001",
"tm": "2018-11-08 14:46:17",
"tname": "测试",
"tnumber": 5,
"url": "https://www.baidu.com",
"wxname": "oRPyJ5dnkYwOs_4Wn1DwipZ108Fk"
},
{
"city": "武汉市",
"id": 7,
"price": 30,
"province": "湖北省",
"region": "江夏区",
"status": "审核通过",
"tcontent": "测试1内容",
"tid": "SGB2018110600001",
"tm": "2018-11-06 16:33:58",
"tname": "测试1",
"tnumber": 1,
"url": "1",
"wxname": "oRPyJ5U-XHjNC0etLJpjcpg2L96g"
}
]
请求第二页的时候先把要渲染的数组设为空不就行了
恩，谢谢，中午想到思路已经按照这个解决了。
你请求第二页的时候，重新设置一下list=[ ]不就行了吗
恩，谢谢，中午想到思路已经按照这个解决了。
你渲染得list里面肯定不止两个item
返回json只有两个。就只有第一页的前两个被覆盖了。
代码这么多看得头疼，你是一页请求一次接口的吗? 如果是直接setData不就可以了
选择页数后传页数索引到服务器返回JSON数据然后setData
直接setData就好了，不用循环。setData({items:res.data})
这种分页应该在wxml里面通过wx:if判断那些数据需要渲染，不知道你是不是这么做的
不是很明白，跟服务器交互获取的JSON数据，分页是每页显示十条，第一页返回十条数据，第二页返回两条数据，就是第二页返回的数据可以覆盖第一页的前两条，但是后面八条都还在。
你是希望怎么做呢，还有就是你的js怎么写的，正常来说返回的数据直接setData就会覆盖原数据了，除非你做了其他操作
就是每一次更换页数的时候，会向接口发起请求，把返回的JSON数据展现出来。关键的应该就是这个JS完整的在上面，如果有错误，麻烦大腿指正。
wx.request({
url: 'http://localhost:8080/VoteSystemServer/User/doFindAll',
data: {
Type: 'status',
SearchName: '审核通过',
sign: '=',
Page: parseInt(index) + parseInt(1)
},
method: 'GET',
dataType: 'json',
responseType: 'text',
success: function (res) {
var arr = res.data;
for (let i = 0; i < arr.length; i++) {
var XXX = arr[i].XXX;
var XXX_data = "items[" + i + "].XXX"
that.setData({
[XXX_data]: XXX
})
}
},
fail: function (res) { },
complete: function (res) {wx.stopPullDownRefresh() },
})
}
说实话我看你的代码有点蒙蔽
哈哈哈，就是我每次更改页数的时候，就发起上面的请求，太长了不让贴就XXX表示了，有一个哥们说直接setData({items:res.data})试试，我等下看看
交出分页的代码片段分析一下..
你好，谢谢帮助，上面补充了一下关键部分的代码。
老歌，你的写法挺奇怪的... 你的最后一页只循环两个数组，所以 setData 只覆盖掉两个
你这里应该用 setData 覆盖掉整个数组，而不是循环覆盖部分数组
进行页面刷新过了，重新渲染不行吗