Mint-UI Swipe 元件
阿新 • • 發佈:2018-11-10
Mint-UI 提供一個 Swipe 元件用於實現輪播,但官方文件實在過於簡陋,此處通過翻閱原始碼查詢到以下實用方法
更多精彩
- 更多技術部落格,請移步 asing1elife’s blog
官方文件
禁止自動滾動
- 控制自動滾動的引數是
auto
,預設值 3000 毫秒 - 在 API 文件中沒有說明如何禁止自動滾動,但是在示例程式碼中有說明將
:auto="0"
即可禁止自動滾動
<mt-swipe :auto="0">
<mt-swipe-item >...</mt-swipe-item>
</mt-swipe>
手動切換上 / 下一個
- API 文件中沒有任何關於操作元件的方法,但在原始碼中可以翻閱到如下程式碼
next() {
this.doAnimate('next')
},
prev() {
this.doAnimate('prev')
},
- 所以可以通過為元件新增
ref
,並呼叫以上方法來實現上下子項的切換
<mt-swipe ref="testSwipe"></mt-swipe>
// 手動切換到下一個
this.$refs. testSwipe.next()
// 手動切換到上一個
this.$refs.testSwipe.prev()