From 63122f5ed4705bc925571b1a6a0ba0d8d0f1dd99 Mon Sep 17 00:00:00 2001 From: tangjinzhou <415800467@qq.com> Date: Sat, 15 Dec 2018 22:11:21 +0800 Subject: [PATCH] feat: update slider to 8.6.4 --- components/vc-slider/index.js | 2 +- components/vc-slider/src/Range.jsx | 6 ++- components/vc-slider/src/Slider.jsx | 7 +++- components/vc-slider/src/common/Steps.jsx | 4 +- .../vc-slider/src/common/createSlider.jsx | 11 ++++-- components/vc-slider/src/utils.js | 37 ++++++++++++++++--- components/vc-steps/Step.jsx | 2 +- 7 files changed, 53 insertions(+), 16 deletions(-) diff --git a/components/vc-slider/index.js b/components/vc-slider/index.js index 94a8909e3..f3b76c2da 100644 --- a/components/vc-slider/index.js +++ b/components/vc-slider/index.js @@ -1,3 +1,3 @@ -// base rc-slider 8.6.3 +// base rc-slider 8.6.4 import Slider from './src/' export default Slider diff --git a/components/vc-slider/src/Range.jsx b/components/vc-slider/src/Range.jsx index 342049a3d..765f7466d 100644 --- a/components/vc-slider/src/Range.jsx +++ b/components/vc-slider/src/Range.jsx @@ -18,6 +18,8 @@ const rangeProps = { disabled: PropTypes.bool, tabIndex: PropTypes.arrayOf(PropTypes.number), prefixCls: PropTypes.string, + min: PropTypes.number, + max: PropTypes.number, } const Range = { name: 'Range', @@ -76,7 +78,7 @@ const Range = { this.setState({ bounds: nextBounds }) - if (bounds.some(v => utils.isValueOutOfRange(v, minAmaxProps))) { + if (value.some(v => utils.isValueOutOfRange(v, minAmaxProps))) { const newValues = value.map((v) => { return utils.ensureValueInRange(v, minAmaxProps) }) @@ -118,7 +120,7 @@ const Range = { this.onChange({ bounds: nextBounds }) }, onEnd () { - this.setState({ sHandle: null }, this.blur) + this.setState({ sHandle: null }) this.removeDocumentEvents() this.$emit('afterChange', this.bounds) }, diff --git a/components/vc-slider/src/Slider.jsx b/components/vc-slider/src/Slider.jsx index 36c4004eb..a1d35ae8d 100644 --- a/components/vc-slider/src/Slider.jsx +++ b/components/vc-slider/src/Slider.jsx @@ -15,6 +15,8 @@ const Slider = { disabled: PropTypes.bool, autoFocus: PropTypes.bool, tabIndex: PropTypes.number, + min: PropTypes.number, + max: PropTypes.number, }, data () { const defaultValue = this.defaultValue !== undefined @@ -22,7 +24,7 @@ const Slider = { const value = this.value !== undefined ? this.value : defaultValue - if (process.env.NODE_ENV !== 'production') { + if (utils.isDev()) { warning( !hasProp(this, 'minimumTrackStyle'), 'minimumTrackStyle will be deprecate, please use trackStyle instead.' @@ -134,6 +136,9 @@ const Slider = { return this.sValue }, trimAlignValue (v, nextProps = {}) { + if (v === null) { + return null + } const mergedProps = { ...this.$props, ...nextProps } const val = utils.ensureValueInRange(v, mergedProps) return utils.ensureValuePrecision(val, mergedProps) diff --git a/components/vc-slider/src/common/Steps.jsx b/components/vc-slider/src/common/Steps.jsx index 37cc9a7cd..e8f45d074 100644 --- a/components/vc-slider/src/common/Steps.jsx +++ b/components/vc-slider/src/common/Steps.jsx @@ -6,7 +6,7 @@ const calcPoints = (vertical, marks, dots, step, min, max) => { dots ? step > 0 : true, '`Slider[step]` should be a positive number in order to make Slider[dots] work.' ) - const points = Object.keys(marks).map(parseFloat) + const points = Object.keys(marks).map(parseFloat).sort((a, b) => a - b) if (dots) { for (let i = min; i <= max; i += step) { if (points.indexOf(i) === -1) { @@ -19,7 +19,7 @@ const calcPoints = (vertical, marks, dots, step, min, max) => { const Steps = { functional: true, - render (createElement, context) { + render (h, context) { const { prefixCls, vertical, marks, dots, step, included, lowerBound, upperBound, max, min, dotStyle, activeDotStyle } = context.props const range = max - min diff --git a/components/vc-slider/src/common/createSlider.jsx b/components/vc-slider/src/common/createSlider.jsx index c21c32e8d..2842c4a7c 100644 --- a/components/vc-slider/src/common/createSlider.jsx +++ b/components/vc-slider/src/common/createSlider.jsx @@ -69,10 +69,11 @@ export default function createSlider (Component) { activeDotStyle: {}, }), data () { - if (process.env.NODE_ENV !== 'production') { + if (utils.isDev()) { const { step, max, min } = this + const isPointDiffEven = isFinite(max - min) ? (max - min) % step === 0 : true; // eslint-disable-line warning( - step && Math.floor(step) === step ? (max - min) % step === 0 : true, + step && Math.floor(step) === step ? isPointDiffEven : true, 'Slider[max] - Slider[min] (%s) should be a multiple of Slider[step] (%s)', max - min, step @@ -108,6 +109,9 @@ export default function createSlider (Component) { methods: { defaultHandle ({ index, ref, className, style, ...restProps }) { delete restProps.dragging + if (restProps.value === null) { + return null + } const handleProps = { props: { ...restProps, @@ -195,12 +199,13 @@ export default function createSlider (Component) { onClickMarkLabel (e, value) { e.stopPropagation() this.onChange({ value }) + this.onEnd() }, getSliderStart () { const slider = this.$refs.sliderRef const rect = slider.getBoundingClientRect() - return this.vertical ? rect.top : rect.left + return this.vertical ? rect.top : (rect.left + window.pageXOffset) }, getSliderLength () { const slider = this.$refs.sliderRef diff --git a/components/vc-slider/src/utils.js b/components/vc-slider/src/utils.js index 8481515e3..5f12e1894 100644 --- a/components/vc-slider/src/utils.js +++ b/components/vc-slider/src/utils.js @@ -1,8 +1,16 @@ import keyCode from '../../_util/KeyCode' +export function isDev () { + return (process.env.NODE_ENV !== 'production') +} + export function isEventFromHandle (e, handles) { - return Object.keys(handles) - .some(key => e.target === handles[key].$el) + try { + return Object.keys(handles) + .some(key => e.target === handles[key].$el) + } catch (error) { + return false + } } export function isValueOutOfRange (value, { min, max }) { @@ -54,7 +62,7 @@ export function getHandleCenterPosition (vertical, handle) { const coords = handle.getBoundingClientRect() return vertical ? coords.top + (coords.height * 0.5) - : coords.left + (coords.width * 0.5) + : window.pageXOffset + coords.left + (coords.width * 0.5) } export function ensureValueInRange (val, { max, min }) { @@ -69,7 +77,7 @@ export function ensureValueInRange (val, { max, min }) { export function ensureValuePrecision (val, props) { const { step } = props - const closestPoint = getClosestPoint(val, props) + const closestPoint = isFinite(getClosestPoint(val, props)) ? getClosestPoint(val, props) : 0; // eslint-disable-line return step === null ? closestPoint : parseFloat(closestPoint.toFixed(getPrecision(step))) } @@ -79,15 +87,32 @@ export function pauseEvent (e) { e.preventDefault() } +export function calculateNextValue (func, value, props) { + const operations = { + increase: (a, b) => a + b, + decrease: (a, b) => a - b, + } + + const indexToGet = operations[func](Object.keys(props.marks).indexOf(JSON.stringify(value)), 1) + const keyToGet = Object.keys(props.marks)[indexToGet] + + if (props.step) { + return operations[func](value, props.step) + } else if (!!Object.keys(props.marks).length && !!props.marks[keyToGet]) { + return props.marks[keyToGet] + } + return value +} + export function getKeyboardValueMutator (e) { switch (e.keyCode) { case keyCode.UP: case keyCode.RIGHT: - return (value, props) => value + props.step + return (value, props) => calculateNextValue('increase', value, props) case keyCode.DOWN: case keyCode.LEFT: - return (value, props) => value - props.step + return (value, props) => calculateNextValue('decrease', value, props) case keyCode.END: return (value, props) => props.max case keyCode.HOME: return (value, props) => props.min diff --git a/components/vc-steps/Step.jsx b/components/vc-steps/Step.jsx index 7bb181993..08b4cfeb9 100644 --- a/components/vc-steps/Step.jsx +++ b/components/vc-steps/Step.jsx @@ -14,7 +14,7 @@ export default { itemWidth: PropTypes.string, status: PropTypes.string, iconPrefix: PropTypes.string, - icon: PropTypes.node, + icon: PropTypes.any, adjustMarginRight: PropTypes.string, stepNumber: PropTypes.string, description: PropTypes.any,