위 챗 애플 릿 swiper 는 네트워크 그림 을 사용 하여 문제 해결 을 표시 하지 않 습 니 다.

이 글 은 주로 위 챗 애플 릿 swiper 가 인터넷 사진 을 사용 하여 문 제 를 표시 하지 않 고 해결 하 는 것 을 소개 했다.글 에서 예시 코드 를 통 해 매우 상세 하 게 소개 되 어 여러분 의 학습 이나 업무 에 어느 정도 참고 학습 가 치 를 가지 고 있 으 므 로 필요 한 친 구 는 참고 할 수 있다.
wxml 코드:

<view class="container">
   <swiper indicator-dots="true}"
    autoplay="true" interval="3000" duration="1">
    <block wx:for="{{imgUrls}}" wx:key="*this">
     <swiper-item>
      <image src="{{item}}" width="355" height="150"></image>
     </swiper-item>
    </block>
   </swiper>
</view>
js 코드:

data: {
  imgUrls: [
   "http://img0.imgtn.bdimg.com/it/u=2394972844,3024358326&fm=26&gp=0.jpg",
   "http://img5.imgtn.bdimg.com/it/u=3008142408,2229729459&fm=26&gp=0.jpg",
   "http://img4.imgtn.bdimg.com/it/u=2939038876,2702387014&fm=26&gp=0.jpg"
  ]
}
결과:(표시 할 수 없습니다.콘 솔 을 보고 오류 가 없 음)

해결,swiper 추가 너비.
wxss:

.container{
 width: 100%;
}
.container swiper{
 width: 100%;
}
정상적으로 표 시 됨:

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기