feat(Swipe): add resize method (#5070)

This commit is contained in:
neverland 2019-11-21 17:11:56 +08:00 committed by GitHub
parent f6650aa1cd
commit 659eb3eefc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 12 deletions

View File

@ -161,6 +161,7 @@ Use ref to get swipe instance and call instance methods
| Name | Description | Attribute | Return value |
|------|------|------|------|
| swipeTo | Swipe to target index | index: target index, options: Options | void |
| resize | Resize swipe when container element resized | - | void |
### swipeTo Options

View File

@ -166,7 +166,8 @@ export default {
| 方法名 | 说明 | 参数 | 返回值 |
|------|------|------|------|
| swipeTo | 滚动到目标位置 | index: 目标位置的索引, options: 选项 | void |
| swipeTo | 滚动到目标位置 | index: number, options: Options | void |
| resize | 外层元素大小变化后,可以调用此方法来触发重绘 | - | void |
### swipeTo Options 格式

View File

@ -11,7 +11,7 @@ export default createComponent({
mixins: [
TouchMixin,
BindEventMixin(function(bind, isBind) {
bind(window, 'resize', this.onResize, true);
bind(window, 'resize', this.resize, true);
if (isBind) {
this.initialize();
@ -154,7 +154,8 @@ export default createComponent({
this.autoPlay();
},
onResize() {
// @exposed-api
resize() {
this.initialize(this.activeIndicator);
},
@ -252,6 +253,7 @@ export default createComponent({
}
},
// @exposed-api
swipeTo(index, options = {}) {
this.swiping = true;
this.resetTouchStatus();

View File

@ -1,19 +1,19 @@
import Vue from 'vue';
import Swipe from '..';
import SwipeItem from '../../swipe-item';
import { mount, triggerDrag, later } from '../../../test';
Vue.use(Swipe);
Vue.use(SwipeItem);
const Component = {
template: `
<swipe ref="swipe" v-bind="$props">
<swipe-item :style="style">1</swipe-item>
<swipe-item :style="style">2</swipe-item>
<swipe-item :style="style">3</swipe-item>
</swipe>
<van-swipe ref="swipe" v-bind="$props">
<van-swipe-item :style="style">1</van-swipe-item>
<van-swipe-item :style="style">2</van-swipe-item>
<van-swipe-item :style="style">3</van-swipe-item>
</van-swipe>
`,
components: {
Swipe,
SwipeItem
},
props: {
vertical: Boolean,
loop: {