blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

fix(SwipeCell): compatible with desktop scenario (#5077)

Browse Source
This commit is contained in:
neverland 2019-11-22 10:32:17 +08:00 committed by GitHub
parent aba9e3f009
commit b889ab09e8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 18 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/swipe-cell/demo/index.vue
View File

@ -1,7 +1,6 @@
<template> <template>
<div> <div>
<demo-section> <demo-section>
<van-notice-bar>{{ $t('tips') }}</van-notice-bar>
<demo-block :title="$t('basicUsage')"> <demo-block :title="$t('basicUsage')">
<van-swipe-cell> <van-swipe-cell>
<template #left> <template #left>
@ -67,8 +66,7 @@ export default {
collect: '收藏', collect: '收藏',
title: '单元格', title: '单元格',
title2: '异步关闭', title2: '异步关闭',
confirm: '确定删除吗？', confirm: '确定删除吗？'
tips: '建议在手机模式下浏览本示例'
}, },
'en-US': { 'en-US': {
select: 'Select', select: 'Select',
@ -76,8 +74,7 @@ export default {
collect: 'Collect', collect: 'Collect',
title: 'Cell', title: 'Cell',
title2: 'Async close', title2: 'Async close',
confirm: 'Are you sure to delete?', confirm: 'Are you sure to delete?'
tips: 'Please try this demo in mobile mode'
} }
}, },

26
src/swipe-cell/index.js
View File

@ -91,7 +91,6 @@ export default createComponent({
return; return;
} }
this.dragging = true;
this.startOffset = this.offset; this.startOffset = this.offset;
this.touchStart(event); this.touchStart(event);
}, },
@ -104,6 +103,9 @@ export default createComponent({
this.touchMove(event); this.touchMove(event);
if (this.direction === 'horizontal') { if (this.direction === 'horizontal') {
this.dragging = true;
this.lockClick = true;
const isPrevent = !this.opened || this.deltaX * this.startOffset < 0; const isPrevent = !this.opened || this.deltaX * this.startOffset < 0;
if (isPrevent) { if (isPrevent) {
@ -121,9 +123,13 @@ export default createComponent({
if (this.dragging) { if (this.dragging) {
this.toggle(this.offset > 0 ? 'left' : 'right'); this.toggle(this.offset > 0 ? 'left' : 'right');
} this.dragging = false;
this.dragging = false; // compatible with desktop scenario
setTimeout(() => {
this.lockClick = false;
}, 0);
}
}, },
toggle(direction) { toggle(direction) {
@ -151,14 +157,12 @@ export default createComponent({
onClick(position = 'outside') { onClick(position = 'outside') {
this.$emit('click', position); this.$emit('click', position);
if (!this.offset) { if (this.opened && !this.lockClick) {
return; if (this.onClose) {
} this.onClose(position, this, { name: this.name });
} else {
if (this.onClose) { this.swipeMove(0);
this.onClose(position, this, { name: this.name }); }
} else {
this.swipeMove(0);
} }
}, },

5
src/swipe-cell/test/__snapshots__/demo.spec.js.snap
View File

@ -3,11 +3,6 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div> <div>
<div role="alert" class="van-notice-bar">
<div role="marquee" class="van-notice-bar__wrap">
<div class="van-notice-bar__content" style="padding-left: 0px; animation-delay: 1s; animation-duration: 0s;">建议在手机模式下浏览本示例</div>
</div>
</div>
<div> <div>
<div class="van-swipe-cell"> <div class="van-swipe-cell">
<div class="van-swipe-cell__wrapper" style="transform: translate3d(0px, 0, 0); transition-duration: .6s;"> <div class="van-swipe-cell__wrapper" style="transform: translate3d(0px, 0, 0); transition-duration: .6s;">

2
src/swipe-cell/test/index.spec.js
View File

@ -59,7 +59,7 @@ it('on-close prop', () => {
wrapper.trigger('click'); wrapper.trigger('click');
expect(position).toEqual(undefined); expect(position).toEqual(undefined);
wrapper.setData({ offset: 100 }); wrapper.vm.open('left');
wrapper.trigger('click'); wrapper.trigger('click');
expect(position).toEqual('cell'); expect(position).toEqual('cell');