一. request promise的安装
首先新建云函数,使用终端打开,输入以下代码
npm install --save request
npm install --save request-promise
注:NPM是随同NodeJS一起安装的包管理工具
- 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
- 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
- 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
二. 在云函数 index.js中
var rp = require(\'request-promise\');//引入库
return rp(\'当前请求的地址\').then(function(res){
console.log(res);
return res;
}).catch(function(err){
console.err(err);
});
注:ES6字符串模板
三 上传并部署云函数
四 page文件中js文件 onload函数:监听页面加载
onLoad: function(options){
wx.cloud.callFunction({
name: \'movielist\'
data:{
start: this.data.movieList.length,
count: 10
}
}).then(res =>{
console.log(res);
this.setDate({
movieList: this.data.novieList.concat(JOSN.parse(res.result).subjects)//将传来的数据拼接在之前的数据上面
})
}).catch(err=> {console.err(err);});
}
五 将数据结果显示到页面中
<view class ="movie" wx:for="{{movieList}}" wx:key="{{index}}">//循环遍历
<image class="movi-img" src="{{item.image.small}}" ></image>
<view class ="movie-info">
<view class="movie-title">{{item.tittle}}</view>
<view>观众评分: {{}}分</view>
</view>
六 拉到底后继续加载内容
wx.showloading({
title: "加载中"
})
// pages/movie/movie.js
Page({
/**
* 页面的初始数据
*/
data: {
movieList: []
},
getMovieList: function() {
wx.showLoading({
title: \'加载中\',
})
wx.cloud.callFunction({
name: \'movielist\',
data: {
start: this.data.movieList.length,
count: 10
}
}).then(res => {
// console.log(res);
this.setData({
movieList: this.data.movieList.concat(JSON.parse(res.result).subjects)
});
wx.hideLoading();
}).catch(err => {
console.error(err);
wx.hideLoading();
});
},
gotoComment: function(event) {
wx.navigateTo({
url: `../comment/comment?movieid=${event.target.dataset.movieid}`,
});
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
this.getMovieList();
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
this.getMovieList();
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
请发表评论