这是我的小程序简单效果图
每一个panel 是一个类别 每次点击查看更多 需要调用接口刷新当前类别的数据
因为这是分类是一个数据 于是我定义成一个data 数组
data: {
category_list:[
{ id: 1, name: '阅读', show: false, loading: true, news_list: [] },
{ id: 2, name: '重复', show: false, loading: true, news_list: [] },
{ id: 3, name: '停留', show: false, loading: true, news_list: [] },
{ id: 4, name: '转发', show: false, loading: true, news_list: [] },
{ id: 5, name: '评论', show: false, loading: true, news_list: [] },
{ id: 6, name: '点赞', show: false, loading: true, news_list: [] },
{ id: 7, name: '搞笑', show: false, loading: true, news_list: [] },
{ id: 8, name: '实用', show: false, loading: true, news_list: [] },
{ id: 9, name: '着数', show: false, loading: true, news_list: [] },
{ id: 10,name: '最美', show: false, loading: true, news_list: [] },
{ id: 11,name: '最萌', show: false, loading: true, news_list: [] },
]
},
这是我小程序的data
因为每次刷新我只需要更新对应的item 如果每次setData category_list 整个数组, 感觉会消耗性能 ,所以只需要setData刷新对应的item
只需要通过 以下方式解决
this.setData({
'array[0].text': 'update data'
})
//如果索引是动态的 则使用下方方式
var mText = 'array['+ index +'].text';
this.setData({
[mText]: 'update data'
})
这是我示例中的方法
//加载列表,index 索引 showAll是否显示全部
getList: function (index,showAll){
var mLoading = 'category_list[' + index + '].loading'
var mNewsList = 'category_list[' + index + '].news_list'
var mShowAll = 'category_list[' + index + '].show'
var that = this;
that.setData({
[mNewsList]: [],
[mLoading]: true
})
var category = this.data.category_list;
var post_data = {
category_id: category[index].id,
filter_date: 0
};
api.getNewsList(function (data) {
that.setData({
[mLoading]: false,
[mShowAll]: showAll
})
if (data.code == 200) {
console.log(mLoading);
that.setData({
[mNewsList]: data.data
})
} else {
wx.showModal({
title: '',
content: data.msg,
showCancel: false
})
}
}, post_data);
}