微信小程序轮播图调用接口

微信小程序轮播图调用接口生命周期函数,页面加载:onLoad:function(options){let_this=this;wx.request({url:’http://www.day.com/index.php/img’,//仅为示例,并非真实的接口地址method:”GET”,success(res){//console.log(res.data.data)letdatas=res.data.data;//渲染_this.setData({datas})},}

大家好,又见面了,我是你们的朋友全栈君。

生命周期函数,页面加载:

onLoad: function (options) {

let _this=this;

wx.request({

url: ‘http://www.day.com/index.php/img’, //仅为示例,并非真实的接口地址

method:”GET”,

success (res) {

// console.log(res.data.data)

let datas=res.data.data;

// 渲染

_this.setData({datas})

},

})

wx.request({

url: ‘http://www.day.com/index.php/goodsList’, //仅为示例,并非真实的接口地址

method:”GET”,

success (res) {

// console.log(res.data.data)

let list=res.data.data;

// 渲染

_this.setData({list})

},

})

}

页面:

<swiper indicator-dots=”{
{true}}” autoplay=”{
{true}}” interval=”{
{1500}}” duration=”{
{500}}” circular=”{
{true}}” indicator-color=”rgb(153,153,153)” indicator-active-color=”rgb(255,255,255)”>

  <block wx:for=”{
{datas}}” wx:key=”index”>

   <swiper-item>

   <image src=”{
{item.img_url}}”/>

   </swiper-item>

  </block>

</swiper>
 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/143323.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号