mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-06 12:17:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(slider): unify mousemove handler

Browse Source
This commit is contained in:
07akioni 2020-12-27 16:41:29 +08:00
parent 336c460378
commit 8a2e695ab1
1 changed files with 22 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
src/slider/src/Slider.vue
View File

@ -121,26 +121,27 @@ import { configurable, themeable, useFormItem, withCssr } from '../../_mixins'
import styles from './styles'
import { warn, call, useAdjustedTo } from '../../_utils'
function handleFirstHandleMouseMove (e) {
const railRect = this.railRef.getBoundingClientRect()
const offsetRatio = (e.clientX - railRect.left) / railRect.width
const newValue = this.min + (this.max - this.min) * offsetRatio
if (this.range) {
this.dispatchValueUpdate([this.memoziedOtherValue, newValue])
function handleHandleMouseMove (e, handleIndex) {
const { width: handleWidth } = this.handleRef1.getBoundingClientRect()
const {
width: railWidth,
left: railLeft
} = this.railRef.getBoundingClientRect()
const { min, max, range } = this
const offsetRatio =
(e.clientX - railLeft - handleWidth / 2) / (railWidth - handleWidth)
const newValue = min + (max - min) * offsetRatio
if (range) {
if (handleIndex === 0) {
this.dispatchValueUpdate([this.memoziedOtherValue, newValue])
} else {
this.dispatchValueUpdate([newValue, this.memoziedOtherValue])
}
} else {
this.dispatchValueUpdate(newValue)
}
}
function handleSecondHandleMouseMove (e) {
const railRect = this.railRef.getBoundingClientRect()
const offsetRatio = (e.clientX - railRect.left) / railRect.width
const newValue = this.min + (this.max - this.min) * offsetRatio
if (this.range) {
this.dispatchValueUpdate([this.memoziedOtherValue, newValue])
}
}
export default {
name: 'Slider',
components: {
@ -674,9 +675,12 @@ export default {
}
}
},
/** do not throttle to make ui sync with action after final move */
handleFirstHandleMouseMove,
handleSecondHandleMouseMove,
handleFirstHandleMouseMove (e) {
handleHandleMouseMove.call(this, e, 0)
},
handleSecondHandleMouseMove (e) {
handleHandleMouseMove.call(this, e, 1)
},
handleFirstHandleMouseEnter () {
if (!this.active) {
this.doUpdateShow(true, undefined)