数据 db.json
用json-server启动服务器,模拟数据
注意事项
微信小程序上线后,后端必须是https域名,并且在开发配置中注册过服务器域名
如果本地模拟数据,则需要在开发者工具,右上角"详情", 开启
{
"goodsList": [
{
"id": 1,
"wineImg": "https://upload.putaojiu.com/2019/0404/1554359109853.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国南部大地珍藏-60年老藤佳丽酿igp干红葡萄酒"
},
{
"id": 2,
"wineImg": "https://upload.putaojiu.com/2019/0404/1554359875733.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国南部大地珍藏-圣希尼昂混酿aop干红葡萄酒"
},
{
"id": 3,
"wineImg": "https://upload.putaojiu.com/2019/0513/1557734417461.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国罗讷河谷村庄级混酿南罗纳河谷顶级AOC干红葡萄酒"
},
{
"id": 4,
"wineImg": "https://upload.putaojiu.com/2019/0814/1565754238560.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国南部大地松谷庄园梅洛IGP干红葡萄"
},
{
"id": 5,
"wineImg": "https://upload.putaojiu.com/2020/0616/1592293946151.jpg",
"address": "",
"numLimit": "1箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/South-Africa.png",
"info": "南非罗伯逊山谷梵劳伦莫斯卡托开普利斯起泡桃红葡萄汁饮料"
},
{
"id": 6,
"wineImg": "https://upload.putaojiu.com/2020/0526/1590459812467.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/Australia.png",
"info": "澳大利亚南澳领宾Linchpin莫斯卡托桃红气泡葡萄酒"
},
{
"id": 7,
"wineImg": "https://upload.putaojiu.com/2020/1124/1606207995193.jpg",
"address": "",
"numLimit": "1箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/Italy.png",
"info": "意大利皮埃蒙特莫斯卡托起泡酒"
},
{
"id": 8,
"wineImg": "https://upload.putaojiu.com/2019/0404/1554359109853.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国8"
},
{
"id": 9,
"wineImg": "https://upload.putaojiu.com/2019/0404/1554359875733.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国9"
},
{
"id": 10,
"wineImg": "https://upload.putaojiu.com/2019/0513/1557734417461.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国10"
},
{
"id": 11,
"wineImg": "https://upload.putaojiu.com/2019/0814/1565754238560.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/French.png",
"info": "法国11"
},
{
"id": 12,
"wineImg": "https://upload.putaojiu.com/2020/0616/1592293946151.jpg",
"address": "",
"numLimit": "1箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/South-Africa.png",
"info": "南非12"
},
{
"id": 13,
"wineImg": "https://upload.putaojiu.com/2020/0526/1590459812467.jpg",
"address": "",
"numLimit": "5箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/Australia.png",
"info": "澳大利亚13"
},
{
"id":14,
"wineImg": "https://upload.putaojiu.com/2020/1124/1606207995193.jpg",
"address": "",
"numLimit": "1箱起批",
"countryIco": "https://img.putaojiu.com/templates/putaojiu/cooper20/images/natflag/Italy.png",
"info": "意dd"
}
]
}
小程序代码
Page({
data: {
list: [],
page: 1,
isReachBottom: false
},
onLoad() {
this.getData(1)
},
// 当下拉刷新时
onPullDownRefresh() {
// console.log('下拉刷新');
this.getData(1)
},
// 加载数据
getData(page) {
wx.showLoading({
title: '加载中',
})
// 页面初始化时加载数据
let temp = this.data.list;
wx.request({
url: `http://127.0.0.1:3000/goodsList?_page=${page}&_limit=4&_sort=id&_order=desc`,
method: 'get',
success: res => {
wx.hideLoading()
if (page >= 5){
this.setData({
isReachBottom: true
})
return;
}
wx.stopPullDownRefresh()
this.setData({
list: [...temp, ...res.data]
})
}
})
},
onReachBottom() {
let page = ++this.data.page;
this.setData({
page
})
this.getData(page)
}
})
网友评论