list为图片列表快捷设置，如果你需要自定义一些样式，或者内容并不为纯图片，可以引用swiper-item组件来自定义。
list 格式如下
[{
url: 'javascript:',
img: 'https://static.vux.li/demo/1.jpg',
title: '送你一朵fua'
}, {
url: 'javascript:',
img: 'https://static.vux.li/demo/5.jpg',
title: '送你一次旅行',
fallbackImg: 'https://static.vux.li/demo/3.jpg'
}]
fallbackImg 在 v2.5.13 支持，它将在 img 加载失败时显示，注意的是 fallbackImg 可能会在 img 加载成功时也进行了加载，只是不会显示（取决于浏览器实现）。
不要在swiper里嵌套scroller，在web上过于复杂化而且手势会有冲突，相关Issue将不会处理。
该组件场景是固定高度的内容列表，不支持为不同 swiper-item 设置不同高度。
如果确实需要设置不同高度，可以通过 ref 获取 swiper, 通过 this.$refs.swiper.xheight = '100px' 设置。 切记，需要放在 $nextTick 中执行。
API
Variables
Props
| name | type | default | description | required version |
| list | array | image list, use swiper-item if you need to customize style | -- | |
| direction | string | horizontal | swiping direction | -- |
| show-dots | boolean | true | if show indicators | -- |
| show-desc-mask | boolean | true | if show description mask | -- |
| dots-position | string | right | indicator position | -- |
| dots-class | string | custom indicator's classname | -- | |
| auto | boolean | false | if auto playing | -- |
| loop | boolean | false | if use loop mode | -- |
| interval | number | 3000 | interval value | -- |
| threshold | number | 50 | threshold value | -- |
| duration | number | 300 | transition duration | -- |
| height | string | 180px | height value | -- |
| aspect-ratio | number | if specified, height will be caculated automatically | -- | |
| min-moving-distance | number | 0 | min distance before moving | -- |
| v-model | number | 0 | index value, use v-model for binding | -- |
Events
| name | params | description | required version |
| @on-index-change | (currentIndex) | fires when index is changed | -- |
| @on-get-height | (height) | fires after height is caculated | v2.7.0 |
Variables
| name | default | description | inherited name |
| @swiper-indicator-active-color | #04BE02 | -- | @theme-color |
Contributors
Contributors
Total commits quantity: 45，Total contributors quantity: 8
airylandunclayClay万刚jackieWilliam WeiF-loatwgChangelog
Releases
- v2.9.2 [fix] fix stuck swipe after setting min-moving-distance #2773
- v2.9.2 [fix] fix error for repeat setting data in loop #2803
- v2.7.7 [fix] fix cannot scroll body when touching with one item
- v2.7.6 [enhance] stop moving width one item
- v2.7.0 [enhance] set shorter distance for first and last item for better experience
- v2.7.0 [feature] add event:on-get-height #2112
- v2.7.0 [enhance] stop interval if auto is set to false #2027
- v2.6.0 [enhance] support fallbackImg for prop:list #1923
- v2.5.3 [fix] clear listTtwoLoopItem when list size !== 2 #1684 @weizs
- v2.5.1 [fix] Fix array-from issue with webpack@3 #1649
- v2.3.5 [fix] Fix repeat render bug #1458
- v2.3.4 [fix] Fix click to fail when only two swiper-item and loop #1484 @unclay
- v2.2.1-rc.2 [enhance] Use document width as swiper width if initial width is 0 #1188
- v2.2.1-rc.2 [fix] Fix initial index > 0 not works
- v2.1.1-rc.3 [fix] Fix nodes list forEach function is undefined #991 @howyhuang
- v2.1.1-rc.2 [fix] Fix es6 iterator compability, use forEach