ui/vant
1
0
Fork 0
mirror of https://github.com/youzan/vant.git synced 2025-10-22 03:44:48 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

[improvement] SwipeCell: fix typo and adjust swipeLeaveTransition method's parameter values (#3048)

Browse Source
This commit is contained in:
流采
2019-03-24 20:43:46 +08:00
committed by neverland
parent 4d85e56d83
commit 76a90eb89e
3 changed files with 33 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
packages/swipe-cell/index.js
View File

@@ -21,7 +21,7 @@ export default sfc({
data() { data() {
return { return {
offset: 0, offset: 0,
draging: false dragging: false
}; };
}, },
@@ -55,13 +55,14 @@ export default sfc({
const threshold = this.opened ? 1 - THRESHOLD : THRESHOLD; const threshold = this.opened ? 1 - THRESHOLD : THRESHOLD;
// right // right
if (direction > 0 && -offset > rightWidth * threshold && rightWidth > 0) { if (direction === 'right' && -offset > rightWidth * threshold && rightWidth > 0) {
this.open('right'); this.open('right');
// left // left
} else if (direction < 0 && offset > leftWidth * threshold && leftWidth > 0) { } else if (direction === 'left' && offset > leftWidth * threshold && leftWidth > 0) {
this.open('left'); this.open('left');
// reset
} else { } else {
this.swipeMove(); this.swipeMove(0);
} }
}, },
@@ -70,7 +71,7 @@ export default sfc({
return; return;
} }
this.draging = true; this.dragging = true;
this.touchStart(event); this.touchStart(event);
if (this.opened) { if (this.opened) {
@@ -96,9 +97,9 @@ export default sfc({
return; return;
} }
this.draging = false; this.dragging = false;
if (this.swiping) { if (this.swiping) {
this.swipeLeaveTransition(this.offset > 0 ? -1 : 1); this.swipeLeaveTransition(this.offset > 0 ? 'left' : 'right');
} }
}, },
@@ -127,7 +128,7 @@ export default sfc({
const wrapperStyle = { const wrapperStyle = {
transform: `translate3d(${this.offset}px, 0, 0)`, transform: `translate3d(${this.offset}px, 0, 0)`,
transition: this.draging ? 'none' : '.6s cubic-bezier(0.18, 0.89, 0.32, 1)' transition: this.dragging ? 'none' : '.6s cubic-bezier(0.18, 0.89, 0.32, 1)'
}; };
return ( return (
@@ -143,7 +144,7 @@ export default sfc({
class={bem('wrapper')} class={bem('wrapper')}
style={wrapperStyle} style={wrapperStyle}
onTransitionend={() => { onTransitionend={() => {
this.swipe = false; this.swiping = false;
}} }}
> >
{this.leftWidth ? ( {this.leftWidth ? (

2
packages/swipe-cell/test/__snapshots__/index.spec.js.snap
View File

@@ -36,7 +36,7 @@ exports[`drag and show left part 4`] = `
</div> </div>
`; `;
exports[`drag and show left part 5`] = ` exports[`drag and show right part 1`] = `
<div class="van-swipe-cell"> <div class="van-swipe-cell">
<div class="van-swipe-cell__wrapper" style="transform: translate3d(-100px, 0, 0); transition: .6s cubic-bezier(0.18, 0.89, 0.32, 1);"> <div class="van-swipe-cell__wrapper" style="transform: translate3d(-100px, 0, 0); transition: .6s cubic-bezier(0.18, 0.89, 0.32, 1);">
<div class="van-swipe-cell__left"></div> <div class="van-swipe-cell__left"></div>

24
packages/swipe-cell/test/index.spec.js
View File

@@ -1,6 +1,7 @@
import SwipeCell from '..'; import SwipeCell from '..';
import { mount, triggerDrag } from '../../../test/utils'; import { mount, triggerDrag } from '../../../test/utils';
const THRESHOLD = 0.15;
const defaultProps = { const defaultProps = {
propsData: { propsData: {
leftWidth: 100, leftWidth: 100,
@@ -24,14 +25,14 @@ it('drag and show left part', () => {
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
it('drag and show left part', () => { it('drag and show right part', () => {
const wrapper = mount(SwipeCell, defaultProps); const wrapper = mount(SwipeCell, defaultProps);
triggerDrag(wrapper, -50, 0); triggerDrag(wrapper, -50, 0);
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
test('on close prop', () => { it('on close prop', () => {
let position; let position;
let instance; let instance;
@@ -74,3 +75,22 @@ it('width equals zero', () => {
}); });
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
it('should reset after drag', () => {
const wrapper = mount(SwipeCell, defaultProps);
triggerDrag(wrapper, (defaultProps.leftWidth * THRESHOLD - 1), 0);
expect(wrapper.vm.offset).toEqual(0);
});
it('disabled prop', () => {
const wrapper = mount(SwipeCell, {
propsData: {
...defaultProps.propsData,
disabled: true,
}
});
triggerDrag(wrapper, 50, 0);
expect(wrapper.vm.offset).toEqual(0);
});