이 글에서는 주로 WeChat 애플릿의 이미지 너비 적응 구현에 대한 관련 정보를 소개합니다. 도움이 필요한 친구는
WeChat 애플릿의 이미지 너비 적응 구현
예제 코드:
wxml 코드:
을 참조하세요.<swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}" wx:key="image"> <swiper-item> <image src="{{item.image}}" model="aspectFit" style="width: {{imageWidth}}px;" bindload="imageLoad" /> </swiper-item> </block> </swiper>
JS 코드:
imageLoad: function () { this.setData({ imageWidth: wx.getSystemInfoSync().windowWidth,//图片宽度 imgUrls: [ { image: "http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg" }, { image: "http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg" }, { image: "http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg" }], indicatorDots: false,//是否显示圆点 autoplay: true,//自动播放 interval: 2000,//间隔时间 duration: 1000//监听滚动和点击事件 }) }
위 내용은 모두의 학습에 도움이 되기를 바랍니다. 중국사이트!
관련 권장 사항:
WeChat 애플릿에서 보기 레이블 너비와 높이를 동적으로 변경하는 방법
앨범의 적응형 너비 비율을 구현하는 방법 WeChat 애플릿의 이미지 구성 요소 표시 방법
위 내용은 WeChat 애플릿에서 이미지 너비 적응 구현의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!