mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
[Doc] swipe: add change event demo (#666)
This commit is contained in:
parent
346638b78a
commit
8d867ddf6d
@ -16,6 +16,15 @@
|
|||||||
</van-swipe-item>
|
</van-swipe-item>
|
||||||
</van-swipe>
|
</van-swipe>
|
||||||
</demo-block>
|
</demo-block>
|
||||||
|
|
||||||
|
<demo-block :title="$t('title3')">
|
||||||
|
<van-swipe @change="onChange">
|
||||||
|
<van-swipe-item>1</van-swipe-item>
|
||||||
|
<van-swipe-item>2</van-swipe-item>
|
||||||
|
<van-swipe-item>3</van-swipe-item>
|
||||||
|
<van-swipe-item>4</van-swipe-item>
|
||||||
|
</van-swipe>
|
||||||
|
</demo-block>
|
||||||
</demo-section>
|
</demo-section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -23,10 +32,14 @@
|
|||||||
export default {
|
export default {
|
||||||
i18n: {
|
i18n: {
|
||||||
'zh-CN': {
|
'zh-CN': {
|
||||||
title2: '图片懒加载'
|
title2: '图片懒加载',
|
||||||
|
title3: '监听 change 事件',
|
||||||
|
message: '当前 Swipe 索引:'
|
||||||
},
|
},
|
||||||
'en-US': {
|
'en-US': {
|
||||||
title2: 'Image Lazyload'
|
title2: 'Image Lazyload',
|
||||||
|
title3: 'Change Event',
|
||||||
|
message: 'Current Swipe index:'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -39,6 +52,12 @@ export default {
|
|||||||
'https://img.yzcdn.cn/public_files/2017/09/05/fd08f07665ed67d50e11b32a21ce0682.jpg'
|
'https://img.yzcdn.cn/public_files/2017/09/05/fd08f07665ed67d50e11b32a21ce0682.jpg'
|
||||||
]
|
]
|
||||||
};
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
onChange(index) {
|
||||||
|
this.$toast(this.$t('message') + index);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -45,6 +45,27 @@ export default {
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### change event
|
||||||
|
|
||||||
|
```html
|
||||||
|
<van-swipe @change="onChange">
|
||||||
|
<van-swipe-item>1</van-swipe-item>
|
||||||
|
<van-swipe-item>2</van-swipe-item>
|
||||||
|
<van-swipe-item>3</van-swipe-item>
|
||||||
|
<van-swipe-item>4</van-swipe-item>
|
||||||
|
</van-swipe>
|
||||||
|
```
|
||||||
|
|
||||||
|
```js
|
||||||
|
export default {
|
||||||
|
methods: {
|
||||||
|
onChange(index) {
|
||||||
|
Toast('Current Swipe index:' + index);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
### API
|
### API
|
||||||
|
|
||||||
| Attribute | Description | Type | Default | Accepted Values |
|
| Attribute | Description | Type | Default | Accepted Values |
|
||||||
|
@ -45,6 +45,27 @@ export default {
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
|
#### 监听 change 事件
|
||||||
|
|
||||||
|
```html
|
||||||
|
<van-swipe @change="onChange">
|
||||||
|
<van-swipe-item>1</van-swipe-item>
|
||||||
|
<van-swipe-item>2</van-swipe-item>
|
||||||
|
<van-swipe-item>3</van-swipe-item>
|
||||||
|
<van-swipe-item>4</van-swipe-item>
|
||||||
|
</van-swipe>
|
||||||
|
```
|
||||||
|
|
||||||
|
```js
|
||||||
|
export default {
|
||||||
|
methods: {
|
||||||
|
onChange(index) {
|
||||||
|
Toast('当前 Swipe 索引:' + index);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
### API
|
### API
|
||||||
|
|
||||||
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|
||||||
|
Loading…
x
Reference in New Issue
Block a user