85 lines
2.2 KiB
Vue
85 lines
2.2 KiB
Vue
import PropTypes from '../_util/vue-types'
|
|
import VcCheckbox from '../vc-checkbox'
|
|
import classNames from 'classnames'
|
|
import { getOptionProps, getAttrs } from '../_util/props-util'
|
|
|
|
function noop () {}
|
|
|
|
export default {
|
|
name: 'ARadio',
|
|
props: {
|
|
prefixCls: {
|
|
default: 'ant-radio',
|
|
type: String,
|
|
},
|
|
defaultChecked: Boolean,
|
|
checked: { type: Boolean, default: undefined },
|
|
disabled: Boolean,
|
|
isGroup: Boolean,
|
|
value: PropTypes.any,
|
|
name: String,
|
|
id: String,
|
|
autoFocus: Boolean,
|
|
type: PropTypes.string.def('radio'),
|
|
},
|
|
model: {
|
|
prop: 'checked',
|
|
},
|
|
inject: {
|
|
radioGroupContext: { default: undefined },
|
|
},
|
|
methods: {
|
|
handleChange (event) {
|
|
const targetChecked = event.target.checked
|
|
this.$emit('input', targetChecked)
|
|
this.$emit('change', event)
|
|
},
|
|
focus () {
|
|
this.$refs.vcCheckbox.focus()
|
|
},
|
|
blur () {
|
|
this.$refs.vcCheckbox.blur()
|
|
},
|
|
},
|
|
|
|
render () {
|
|
const { $slots, $listeners, radioGroupContext: radioGroup } = this
|
|
const props = getOptionProps(this)
|
|
const children = $slots.default
|
|
const { mouseenter = noop, mouseleave = noop, ...restListeners } = $listeners
|
|
const {
|
|
prefixCls,
|
|
...restProps
|
|
} = props
|
|
const radioProps = { props: { ...restProps, prefixCls }, on: restListeners, attrs: getAttrs(this) }
|
|
|
|
if (radioGroup) {
|
|
radioProps.props.name = radioGroup.name
|
|
radioProps.on.change = radioGroup.onRadioChange
|
|
radioProps.props.checked = props.value === radioGroup.stateValue
|
|
radioProps.props.disabled = props.disabled || radioGroup.disabled
|
|
} else {
|
|
radioProps.on.change = this.handleChange
|
|
}
|
|
const wrapperClassString = classNames({
|
|
[`${prefixCls}-wrapper`]: true,
|
|
[`${prefixCls}-wrapper-checked`]: radioProps.props.checked,
|
|
[`${prefixCls}-wrapper-disabled`]: radioProps.props.disabled,
|
|
})
|
|
|
|
return (
|
|
<label
|
|
class={wrapperClassString}
|
|
onMouseenter={mouseenter}
|
|
onMouseleave={mouseleave}
|
|
>
|
|
<VcCheckbox
|
|
{...radioProps}
|
|
ref='vcCheckbox'
|
|
/>
|
|
{children !== undefined ? <span>{children}</span> : null}
|
|
</label>
|
|
)
|
|
},
|
|
}
|