feat: update switch to 1.8.0

pull/309/head
wangxueliang 2018-10-31 19:28:53 +08:00
parent ef31389965
commit 1370d4b7e9
4 changed files with 12 additions and 8 deletions

View File

@ -12,4 +12,5 @@ export const switchPropTypes = {
checked: PropTypes.bool.def(false), checked: PropTypes.bool.def(false),
defaultChecked: PropTypes.bool.def(false), defaultChecked: PropTypes.bool.def(false),
autoFocus: PropTypes.bool.def(false), autoFocus: PropTypes.bool.def(false),
loadingIcon: PropTypes.any,
} }

View File

@ -62,8 +62,6 @@ export default {
this.setChecked(false) this.setChecked(false)
} else if (e.keyCode === 39) { // Right } else if (e.keyCode === 39) { // Right
this.setChecked(true) this.setChecked(true)
} else if (e.keyCode === 32 || e.keyCode === 13) { // Space, Enter
this.toggle()
} }
}, },
handleMouseUp (e) { handleMouseUp (e) {
@ -80,9 +78,8 @@ export default {
}, },
}, },
render () { render () {
const { prefixCls, disabled, tabIndex, ...restProps } = getOptionProps(this) const { prefixCls, disabled, loadingIcon, ...restProps } = getOptionProps(this)
const checked = this.stateChecked const checked = this.stateChecked
const switchTabIndex = disabled ? -1 : (tabIndex || 0)
const switchClassName = { const switchClassName = {
[prefixCls]: true, [prefixCls]: true,
[`${prefixCls}-checked`]: checked, [`${prefixCls}-checked`]: checked,
@ -97,17 +94,21 @@ export default {
mouseup: this.handleMouseUp, mouseup: this.handleMouseUp,
}, },
attrs: { attrs: {
tabIndex: switchTabIndex, type: 'button',
role: 'switch',
'aria-checked': checked,
disabled,
}, },
class: switchClassName, class: switchClassName,
ref: 'refSwitchNode', ref: 'refSwitchNode',
} }
return ( return (
<span {...spanProps}> <button {...spanProps}>
{loadingIcon}
<span class={`${prefixCls}-inner`}> <span class={`${prefixCls}-inner`}>
{checked ? getComponentFromProp(this, 'checkedChildren') : getComponentFromProp(this, 'unCheckedChildren')} {checked ? getComponentFromProp(this, 'checkedChildren') : getComponentFromProp(this, 'unCheckedChildren')}
</span> </span>
</span> </button>
) )
}, },
} }

View File

@ -9,6 +9,7 @@
width: 44px; width: 44px;
height: 22px; height: 22px;
line-height: 20px; line-height: 20px;
padding: 0;
vertical-align: middle; vertical-align: middle;
border-radius: 20px 20px; border-radius: 20px 20px;
border: 1px solid #ccc; border: 1px solid #ccc;
@ -21,6 +22,7 @@
font-size: 12px; font-size: 12px;
position: absolute; position: absolute;
left: 24px; left: 24px;
top: 0;
} }
&:after { &:after {

View File

@ -1,4 +1,4 @@
// base rc-switch 1.6.0 // base rc-switch 1.8.0
import Switch from './Switch' import Switch from './Switch'
export default Switch export default Switch