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

fix(slider): fix emit value is not final value (#5112)

Browse Source 
* fix(slider): fix emit value is not  final value

* fix: fix change event emit multiple times
This commit is contained in:
landluck 2022-11-28 17:25:37 +08:00 committed by GitHub
parent 3f6403f5b3
commit 09360b2df3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
packages/slider/index.ts
View File

@ -1,10 +1,16 @@
import { VantComponent } from '../common/component'; import { VantComponent } from '../common/component';
import { touch } from '../mixins/touch'; import { touch } from '../mixins/touch';
import { canIUseModel } from '../common/version'; import { canIUseModel } from '../common/version';
import { getRect, addUnit } from '../common/utils'; import { getRect, addUnit, nextTick } from '../common/utils';
type SliderValue = number | [number, number]; type SliderValue = number | [number, number];
const DRAG_STATUS = {
START: 'start',
MOVING: 'moving',
END: 'end',
};
VantComponent({ VantComponent({
mixins: [touch], mixins: [touch],
@ -64,18 +70,19 @@ VantComponent({
} else { } else {
this.startValue = this.format(this.newValue); this.startValue = this.format(this.newValue);
} }
this.dragStatus = 'start';
this.dragStatus = DRAG_STATUS.START;
}, },
onTouchMove(event: WechatMiniprogram.TouchEvent) { onTouchMove(event: WechatMiniprogram.TouchEvent) {
if (this.data.disabled) return; if (this.data.disabled) return;
if (this.dragStatus === 'start') { if (this.dragStatus === DRAG_STATUS.START) {
this.$emit('drag-start'); this.$emit('drag-start');
} }
this.touchMove(event); this.touchMove(event);
this.dragStatus = 'draging'; this.dragStatus = DRAG_STATUS.MOVING;
getRect(this, '.van-slider').then((rect) => { getRect(this, '.van-slider').then((rect) => {
const { vertical } = this.data; const { vertical } = this.data;
@ -89,6 +96,7 @@ VantComponent({
} else { } else {
this.newValue = this.startValue + diff; this.newValue = this.startValue + diff;
} }
this.updateValue(this.newValue, false, true); this.updateValue(this.newValue, false, true);
}); });
}, },
@ -96,9 +104,13 @@ VantComponent({
onTouchEnd() { onTouchEnd() {
if (this.data.disabled) return; if (this.data.disabled) return;
if (this.dragStatus === 'draging') { if (this.dragStatus === DRAG_STATUS.MOVING) {
this.updateValue(this.newValue, true); this.dragStatus = DRAG_STATUS.END;
this.$emit('drag-end');
nextTick(() => {
this.updateValue(this.newValue, true);
this.$emit('drag-end');
});
} }
}, },
@ -161,7 +173,9 @@ VantComponent({
this.setData({ this.setData({
wrapperStyle: ` wrapperStyle: `
background: ${this.data.inactiveColor || ''}; background: ${this.data.inactiveColor || ''};
${vertical ? 'width' : 'height'}: ${addUnit(this.data.barHeight) || ''}; ${vertical ? 'width' : 'height'}: ${
addUnit(this.data.barHeight) || ''
};
`, `,
barStyle: ` barStyle: `
${mainAxis}: ${this.calcMainAxis()}; ${mainAxis}: ${this.calcMainAxis()};
@ -195,11 +209,10 @@ VantComponent({
getOffsetWidth(current: number, min: number) { getOffsetWidth(current: number, min: number) {
const scope = this.getScope(); const scope = this.getScope();
// 避免最小值小于最小step时出现负数情况
return `${Math.max((current - min) * 100 / scope, 0)}%`;
},
// 避免最小值小于最小step时出现负数情况
return `${Math.max(((current - min) * 100) / scope, 0)}%`;
},
// 计算选中条的长度百分比 // 计算选中条的长度百分比
calcMainAxis() { calcMainAxis() {
@ -209,7 +222,7 @@ VantComponent({
if (this.isRange(value)) { if (this.isRange(value)) {
return this.getOffsetWidth(value[1], value[0]); return this.getOffsetWidth(value[1], value[0]);
} }
return this.getOffsetWidth(value, Number(min)); return this.getOffsetWidth(value, Number(min));
}, },