天天看點

​微信小程式實作banner輪播圖

一:準備工作

準備輪播的兩張圖。

​微信小程式實作banner輪播圖

二:編寫xsml代碼(即html)

在這裡我們要是用<swiper></swiper>标簽來進行包裹,他有如下屬性:

​微信小程式實作banner輪播圖
​微信小程式實作banner輪播圖

這些屬性足夠我們使用,我們為了是xsml頁面簡潔,是以我在這裡使用了for循環,将使用到的資源放進js中進行循環。而且為了使資料可進行雙向綁定,是以他的屬性值我打算放到js中進行配置。我的xsml代碼如下:

1

2

3

4

5

6

7

8

<

swiper

indicator-dots="{ {indicatorDots}}" 

autoplay=&#

繼續閱讀