feat: update checkbox divider dropdown

pull/309/head
tangjinzhou 2018-11-30 22:58:46 +08:00
parent 6b5c0a404b
commit 380331df80
8 changed files with 28 additions and 5 deletions

View File

@ -55,7 +55,10 @@ export default {
} = props } = props
const checkboxProps = { props: { ...restProps, prefixCls }, on: restListeners, attrs: getAttrs(this) } const checkboxProps = { props: { ...restProps, prefixCls }, on: restListeners, attrs: getAttrs(this) }
if (checkboxGroup) { if (checkboxGroup) {
checkboxProps.on.change = () => checkboxGroup.toggleOption({ label: children, value: props.value }) checkboxProps.on.change = (...args) => {
this.$emit('change', ...args)
checkboxGroup.toggleOption({ label: children, value: props.value })
}
checkboxProps.props.checked = checkboxGroup.sValue.indexOf(props.value) !== -1 checkboxProps.props.checked = checkboxGroup.sValue.indexOf(props.value) !== -1
checkboxProps.props.disabled = props.disabled || checkboxGroup.disabled checkboxProps.props.disabled = props.disabled || checkboxGroup.disabled
} else { } else {

View File

@ -1,6 +1,7 @@
import Checkbox from './Checkbox' import Checkbox from './Checkbox'
import hasProp from '../_util/props-util' import hasProp from '../_util/props-util'
function noop () {}
export default { export default {
name: 'ACheckboxGroup', name: 'ACheckboxGroup',
props: { props: {
@ -82,7 +83,7 @@ export default {
disabled={'disabled' in option ? option.disabled : props.disabled} disabled={'disabled' in option ? option.disabled : props.disabled}
value={option.value} value={option.value}
checked={state.sValue.indexOf(option.value) !== -1} checked={state.sValue.indexOf(option.value) !== -1}
onChange={() => this.toggleOption(option)} onChange={option.onChange || noop}
class={`${groupPrefixCls}-item`} class={`${groupPrefixCls}-item`}
> >
{option.label} {option.label}

View File

@ -103,4 +103,21 @@ describe('CheckboxGroup', () => {
expect(wrapper.vm.sValue).toEqual(['Apple']) expect(wrapper.vm.sValue).toEqual(['Apple'])
}) })
}) })
// https://github.com/ant-design/ant-design/issues/12642
it('should trigger onChange in sub Checkbox', () => {
const onChange = jest.fn()
const wrapper = mount({
render () {
return (
<Checkbox.Group>
<Checkbox value='my' onChange={onChange} />
</Checkbox.Group>
)
},
})
wrapper.findAll('.ant-checkbox-input').at(0).trigger('change')
expect(onChange).toBeCalled()
expect(onChange.mock.calls[0][0].target.value).toEqual('my')
})
}) })

View File

@ -29,6 +29,7 @@
category: 'Components', category: 'Components',
subtitle: '多选框', subtitle: '多选框',
type: 'Data Entry', type: 'Data Entry',
zhType: '数据录入',
title: 'Checkbox', title: 'Checkbox',
render () { render () {
return ( return (

View File

@ -23,7 +23,7 @@
| -------- | ----------- | ---- | ------- | | -------- | ----------- | ---- | ------- |
| defaultValue | Default selected value | string\[] | \[] | | defaultValue | Default selected value | string\[] | \[] |
| disabled | Disable all checkboxes | boolean | false | | disabled | Disable all checkboxes | boolean | false |
| options | Specifies options | string\[] \| Array&lt;{ label: string value: string disabled?: boolean }> | \[] | | options | Specifies options | string\[] \| Array&lt;{ label: string value: string disabled?: boolean, onChange?: function }> | \[] |
| value | Used for setting the currently selected value. | string\[] | \[] | | value | Used for setting the currently selected value. | string\[] | \[] |
#### events #### events

View File

@ -25,9 +25,8 @@
| --- | --- | --- | --- | | --- | --- | --- | --- |
| defaultValue | 默认选中的选项 | string\[] | \[] | | defaultValue | 默认选中的选项 | string\[] | \[] |
| disabled | 整组失效 | boolean | false | | disabled | 整组失效 | boolean | false |
| options | 指定可选项 | string\[] \| Array&lt;{ label: string value: string disabled?: boolean }> | \[] | | options | 指定可选项 | string\[] \| Array&lt;{ label: string value: string disabled?: boolean, onChange?: function }> | \[] |
| value | 指定选中的选项 | string\[] | \[] | | value | 指定选中的选项 | string\[] | \[] |
| onChange | 变化时回调函数 | Function(checkedValue) | - |
#### 事件 #### 事件
| 事件名称 | 说明 | 回调参数 | | 事件名称 | 说明 | 回调参数 |

View File

@ -23,6 +23,7 @@ const md = {
export default { export default {
category: 'Components', category: 'Components',
type: 'Other', type: 'Other',
zhType: '其他',
title: 'Divider', title: 'Divider',
subtitle: '分割线', subtitle: '分割线',
render () { render () {

View File

@ -27,6 +27,7 @@ export default {
category: 'Components', category: 'Components',
subtitle: '下拉菜单', subtitle: '下拉菜单',
type: 'Navigation', type: 'Navigation',
zhType: '导航',
title: 'Dropdown', title: 'Dropdown',
render () { render () {
return ( return (