小程序开发调用本地接口(小程序模块内容列表数据调用)
小程序开发调用本地接口(小程序模块内容列表数据调用)<scroll-view class="news-item" scroll-y="true"> <block wx:for="{{listData}}" wx:for-item="news"> <navigator url="../news/show?id={{news.id}}"> <view class="news-view"> <image src="{{news.thumb}}" wx:if="{{news.thumb!=''}}"/> <view class="news-content"> &l
调用模块内容数据在小程序页面中显示,用到的api接口是:
/index.php?appid=[授权ID]&appsecret=[授权码]&s=[模块目录]&c=search&pagesize=10&page=1&api_call_function=module_search_news_lis
pages\news\list.js 文件中请求小程序的代码
var app=getApp();//获取appid
Page({
/**
* 页面的初始数据
*/
data: {
listData:[]
hidden: true
page: 1
hasMore:"false"
}
onLoad:function(options){
// 请求服务器数据
var self=this;
wx.request({
url: "http://www.pcms.com/index.php?appid=2&appsecret=PHPCMF9BF840CB2139F&s=news&c=search&pagesize=10&api_call_function=module_search_news_list"
method: 'GET'
success: function(res){
console.log(res.data);
if (res.data.code == 1) {
self.setData({
listData:res.data.data
page: 1
});
} else {
console.log(res.data.msg);
}
}
})
}
onReachBottom:function(){
// 绑定分页操作
this.setData({hidden:false});
var self=this;
var pageid = self.data.page 1;
wx.request({
url: "http://www.pcms.com/index.php?appid=2&appsecret=PHPCMF9BF840CB2139F&s=news&c=search&pagesize=10&api_call_function=module_search_news_list"
method: 'GET'
data: {
page: pageid
}
success: function(res){
if (res.data.code == 1) {
if(res.data.data.length==0){
self.setData({
hasMore:"true"
hidden:false
});
setTimeout(function(){
self.setData({
hasMore:"false"
hidden:true
});
} 900)
}else{
self.setData({
listData:res.data.data
hidden:true
page:pageid
});
}
} else {
console.log(res.data.msg);
}
}
})
}
})
这个请求代码表示请求后台news模块的内容数据
pages\news\list.wxml 小程序模板代码为:
<scroll-view class="news-item" scroll-y="true">
<block wx:for="{{listData}}" wx:for-item="news">
<navigator url="../news/show?id={{news.id}}">
<view class="news-view">
<image src="{{news.thumb}}" wx:if="{{news.thumb!=''}}"/>
<view class="news-content">
<view class="news-title">
{{news.title}}
</view>
<view class="pos">
<view class="news-time">{{news.inputtime}}</view>
<view class="fr">
<view class="news-see">
<image src="../../icons/see.png" />
{{news.hits}}
</view>
<view class="news-pl">
<image src="../../icons/message.png" />
{{news.comments}}
</view>
</view>
</view>
</view>
</view>
</navigator>
</block>
</scroll-view>
<view class="pl-bottom">
<view hidden="{{hidden}}" class="hidden" wx:if="{{hasMore!='true'}}"> 正在加载....</view>
<view hidden="{{hidden}}" class="hidden" wx:else>没有更多数据了....</view>
</view>
pages\news\list.wxss
.index-banner{
width: 100%;
height: 285rpx;
}
.index-banner image{
width: 100%;
height: 100%;
}
.fast-news{
padding: 30rpx 30rpx 30rpx 30rpx;
display: flex;
border-bottom: 1px solid #eeeeee;
}
.red-sub{
width: 80rpx;
height: 34rpx;
background-color: #ff402e;
color: white;
font-size: 28rpx;
text-align: center;
line-height: 34rpx;
border-radius: 2rpx;
}
.kx-title{
font-size: 32rpx;
margin-left: 20rpx;
}
.news-item{
width: 100%;
}
.news-view{
padding: 30rpx 0 30rpx 0;
display: flex;
border-bottom: 1px solid #eeeeee;
margin: 0 30rpx 0 30rpx;
}
.news-view image{
width: 241rpx;
height: 148rpx;
}
.news-content{
margin-left: 20rpx;
width: 100%;
}
.news-title{
line-height: 45rpx;
overflow: hidden;
font-size: 28rpx;
padding-bottom: 30rpx;
}
.news-hot{
box-sizing: border-box;
border: 1px solid #ff402e;
width: 80rpx;
height:40rpx;
line-height: 40rpx;
text-align: center;
font-size: 13rpx;
color: #ff402e;
margin-left: 10rpx;
}
.pl-bottom {
margin-top:30rpx;
}