现在人工智能非常火爆,很多朋友都想学,但是一般的教程都是为博硕生准备的,太难看懂了。最近发现了一个非常适合小白入门的教程,不仅通俗易懂而且还很风趣幽默。所以忍不住分享一下给大家。点这里可以跳转到教程。
如图,微信小程序实现上拉加载,下拉刷新。代码如下
js文件代码
// pages/loading/loading.js
var p = 1
var url = "http://192.168.30.4:8080/gtxcx/carrier/getCarrier.action";
var GetList = function (that) {
that.setData({
hidden: false
});
wx.request({
url: url,
data: {
pageSize: 10,
pageNo: p
},
success: function (res) {
var l = that.data.list
for (var i = 0; i < res.data.length; i++) {
l.push(res.data[i])
}
that.setData({
list: l
});
p++;
that.setData({
hidden: true
});
}
});
}
Page({
data: {
list: []
},
onLoad: function (options) {
// 页面初始化 options为页面跳转所带来的参数
var that = this
GetList(that)
},
onPullDownRefresh: function () {
//下拉
console.log("下拉");
p = 1;
this.setData({
list: [],
});
var that = this
GetList(that)
},
onReachBottom: function () {
//上拉
console.log("上拉")
var that = this
GetList(that)
}
})
json文件代码
{
"enablePullDownRefresh": true,
"backgroundTextStyle": "dark"
}
wxml文件代码
<view class="item" wx:for="{{list}}" wx:for-item="item" for:key="item.carrierId">
<image class="img" src="https://cdn.kuaidi100.com/images/all/56/zhongtong.png"></image>
<text calss="txt" >{{item.carrierName}}</text>
<text class="txt">{{item.carrierId}}</text>
</view>
wxss文件代码
.img{
border-radius: 50%;
height: 100rpx;
width: 100rpx;
}
.txt{
margin: 10rpx 10rps 10rpx 10rpx;
font-family: "微软雅黑";
font-size: 50rpx;
height: 50rpx;
}
说明:这个接口返回的就是 分页的数据,根据传入的参数,每次返回不同的数据
http://192.168.30.4:8080/gtxcx/carrier/getCarrier.action