1. 程式人生 > >Mint-UI Swipe 元件

Mint-UI Swipe 元件

Mint-UI 提供一個 Swipe 元件用於實現輪播,但官方文件實在過於簡陋,此處通過翻閱原始碼查詢到以下實用方法

更多精彩

官方文件

  1. Swipe 文件
  2. Swipe 原始碼

禁止自動滾動

  1. 控制自動滾動的引數是 auto ,預設值 3000 毫秒
  2. 在 API 文件中沒有說明如何禁止自動滾動,但是在示例程式碼中有說明將 :auto="0" 即可禁止自動滾動
<mt-swipe :auto="0">
  <mt-swipe-item
>
...</mt-swipe-item> </mt-swipe>

手動切換上 / 下一個

  1. API 文件中沒有任何關於操作元件的方法,但在原始碼中可以翻閱到如下程式碼
next() {
	this.doAnimate('next')
},
prev() {
	this.doAnimate('prev')
},
  1. 所以可以通過為元件新增 ref ,並呼叫以上方法來實現上下子項的切換
<mt-swipe ref="testSwipe"></mt-swipe>
// 手動切換到下一個
this.$refs.
testSwipe.next() // 手動切換到上一個 this.$refs.testSwipe.prev()