pull/165/head
wangxueliang 2018-03-26 12:18:06 +08:00
parent 6bf84b865c
commit 17ed8564f6
5 changed files with 24 additions and 14 deletions

View File

@ -13,12 +13,15 @@ export default {
}, },
render () { render () {
const handle = (props) => { const handle = (props) => {
const { value, dragging, index, ...restProps } = props const { value, dragging, index, refStr, ...restProps } = props
const handleProps = { const handleProps = {
props: { props: {
...restProps, ...restProps,
value, value,
}, },
attrs: {
refStr,
},
key: index, key: index,
} }
return ( return (

View File

@ -53,10 +53,10 @@ export default {
this.focus() this.focus()
}, },
focus () { focus () {
this.$refs[this.refStr].focus() this.$refs.handle.focus()
}, },
blur () { blur () {
this.$refs[this.refStr].blur() this.$refs.handle.blur()
}, },
}, },
render () { render () {
@ -87,6 +87,7 @@ export default {
attrs: { attrs: {
role: 'slider', role: 'slider',
tabIndex: disabled ? null : (tabIndex || 0), tabIndex: disabled ? null : (tabIndex || 0),
refStr,
...ariaProps, ...ariaProps,
...restProps, ...restProps,
}, },
@ -96,7 +97,7 @@ export default {
blur: this.handleBlur, blur: this.handleBlur,
keydown: this.handleKeyDown, keydown: this.handleKeyDown,
}, },
ref: refStr, ref: 'handle',
} }
return ( return (
<div <div

View File

@ -169,7 +169,6 @@ const Slider = {
const { sValue, dragging } = this const { sValue, dragging } = this
const offset = this.calcOffset(sValue) const offset = this.calcOffset(sValue)
const handle = handleGenerator({ const handle = handleGenerator({
className: `${prefixCls}-handle`,
prefixCls, prefixCls,
vertical, vertical,
offset, offset,

View File

@ -42,12 +42,15 @@ export default function createSlider (Component) {
max: 100, max: 100,
step: 1, step: 1,
marks: {}, marks: {},
handle ({ index, ...restProps }) { handle ({ index, refStr, ...restProps }) {
delete restProps.dragging delete restProps.dragging
const handleProps = { const handleProps = {
props: { props: {
...restProps, ...restProps,
}, },
attrs: {
refStr,
},
key: index, key: index,
} }
return <Handle {...handleProps} /> return <Handle {...handleProps} />
@ -90,10 +93,12 @@ export default function createSlider (Component) {
}, },
methods: { methods: {
setHandleRefs () { setHandleRefs () {
const refs = this.$refs const refs = this.$refs.handleRef
Object.keys(refs).map((item) => { const children = Array.prototype.slice.call(refs.children)
if (item.indexOf('handlesRefs') > -1) { children.map((item) => {
const handleArr = item.split('handlesRefs') const refStr = item.getAttribute('refStr')
if (refStr.indexOf('handleRef') > -1) {
const handleArr = refStr.split('handleRef')
this.handlesRefs[handleArr[1]] = item this.handlesRefs[handleArr[1]] = item
} }
}) })
@ -305,7 +310,9 @@ export default function createSlider (Component) {
dotStyle={dotStyle} dotStyle={dotStyle}
activeDotStyle={activeDotStyle} activeDotStyle={activeDotStyle}
/> />
{handles} <div ref='handleRef'>
{handles}
</div>
<Marks <Marks
{...markProps} {...markProps}
/> />

View File

@ -2,7 +2,7 @@
import PropTypes from '../_util/vue-types' import PropTypes from '../_util/vue-types'
import Trigger from '../trigger' import Trigger from '../trigger'
import { placements } from './placements' import { placements } from './placements'
import { hasProp, getComponentFromProp } from '../_util/props-util' import { hasProp, getComponentFromProp, getOptionProps } from '../_util/props-util'
function noop () {} function noop () {}
export default { export default {
props: { props: {
@ -57,14 +57,13 @@ export default {
destroyTooltipOnHide, destroyTooltipOnHide,
defaultVisible, getTooltipContainer, defaultVisible, getTooltipContainer,
...restProps ...restProps
} = this.$props } = getOptionProps(this)
const extraProps = { ...restProps } const extraProps = { ...restProps }
if (hasProp(this, 'visible')) { if (hasProp(this, 'visible')) {
extraProps.popupVisible = this.$props.visible extraProps.popupVisible = this.$props.visible
} }
const triggerProps = { const triggerProps = {
props: { props: {
...extraProps,
popupClassName: overlayClassName, popupClassName: overlayClassName,
prefixCls: prefixCls, prefixCls: prefixCls,
action: trigger, action: trigger,
@ -80,6 +79,7 @@ export default {
mouseLeaveDelay: mouseLeaveDelay, mouseLeaveDelay: mouseLeaveDelay,
popupStyle: overlayStyle, popupStyle: overlayStyle,
mouseEnterDelay: mouseEnterDelay, mouseEnterDelay: mouseEnterDelay,
...extraProps,
}, },
on: { on: {
popupVisibleChange: this.$listeners.visibleChange || noop, popupVisibleChange: this.$listeners.visibleChange || noop,