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 click invalid with vertical props (#4532)

Browse Source 
* fix(Slider): fix click invalid with vertical props

* fix: adjust demo
This commit is contained in:
nemo-shen 2021-09-28 09:48:10 +08:00 committed by GitHub
parent 231f65b1a2
commit 91f44798a5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
example/pages/slider/index.wxml
View File

@ -67,7 +67,7 @@
<demo-block title="垂直方向"> <demo-block title="垂直方向">
<view style="height: 150px; padding-left: 30px;"> <view style="height: 150px; padding-left: 30px;">
<van-slider <van-slider
value="{{ currentValue }}" value="{{ 50 }}"
vertical vertical
custom-class="slider" custom-class="slider"
bind:change="onChange" bind:change="onChange"

7
packages/slider/index.ts
View File

@ -109,9 +109,10 @@ VantComponent({
getRect(this, '.van-slider').then((rect) => { getRect(this, '.van-slider').then((rect) => {
const { vertical } = this.data; const { vertical } = this.data;
const touch = event.touches[0];
const delta = vertical const delta = vertical
? event.detail.y - rect.top ? touch.clientY - rect.top
: event.detail.x - rect.left; : touch.clientX - rect.left;
const total = vertical ? rect.height : rect.width; const total = vertical ? rect.height : rect.width;
const value = Number(min) + (delta / total) * this.getRange(); const value = Number(min) + (delta / total) * this.getRange();
@ -160,7 +161,7 @@ VantComponent({
this.setData({ this.setData({
wrapperStyle: ` wrapperStyle: `
background: ${this.data.inactiveColor || ''}; background: ${this.data.inactiveColor || ''};
${mainAxis}: ${addUnit(this.data.barHeight) || ''}; ${vertical ? 'width' : 'height'}: ${addUnit(this.data.barHeight) || ''};
`, `,
barStyle: ` barStyle: `
${mainAxis}: ${this.calcMainAxis()}; ${mainAxis}: ${this.calcMainAxis()};