原生请求与Promise方法
原生请求
使用请求,并且使用返回值的页面的js文件
data: {
// 轮播图数组
swiperList:[]
},
// 页面开始加载就会触发
onLoad: function (options) {
// 发送异步请求获取轮播图数据
wx.request({
url: 'https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata',
success: (result) => {
console.log(result);
this.setData({
swiperList:result.data.message
})
}
})
},
Promise方法
新建一个与Pages文件夹同层级的文件夹【request】,在文件夹中新建一个index.js文件。命名是可以随意的,后缀一样就行。代码如下:
export const request=(params)=>{
return new Promise((resolve,reject)=>{
wx.request({
...params,
success: (result) => {
resolve(result);
},
fail:(err)=>{
reject(err);
}
});
})
}
使用请求,并且使用返回值的页面的js文件:
data: {
// 轮播图数组
swiperList:[]
},
// 页面开始加载就会触发
onLoad: function (options) {
// 发送异步请求获取轮播图数据
request({url: 'https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata'})
.then(result=>{
this.setData({
swiperList:result.data.message
})
})
},
共用的wxml页面:
<!--index.wxml-->
<view class="pyg_index">
<SearchInput></SearchInput><!-- 搜索框 -->
<view class="index_swiper"> <!-- 轮播图 -->
<swiper autoplay indicator-dots circular>
<swiper-item wx:for="{{swiperList}}" wx:key="goods_id">
<navigator>
<image mode="widthFix" src="{{item.image_src}}"></image>
</navigator>
</swiper-item>
</swiper>
</view>
</view>