From 3d6bffb06715177e8398de714f21ced2a38a03e9 Mon Sep 17 00:00:00 2001
From: tangjinzhou <415800467@qq.com>
Date: Mon, 22 Jun 2020 22:27:40 +0800
Subject: [PATCH] fix: checkbox
---
antdv-demo | 2 +-
breakChange-2.x.md | 8 ++++++++
components/checkbox/Checkbox.jsx | 19 ++++++++++++++-----
components/checkbox/Group.jsx | 21 ++++++++++++---------
components/grid/Col.jsx | 14 +++-----------
components/grid/Row.jsx | 5 +++--
components/statistic/Number.jsx | 2 --
7 files changed, 41 insertions(+), 30 deletions(-)
diff --git a/antdv-demo b/antdv-demo
index bf1777054..be126edd5 160000
--- a/antdv-demo
+++ b/antdv-demo
@@ -1 +1 @@
-Subproject commit bf1777054fbe55a0d3bbdd037573e3a235137fbb
+Subproject commit be126edd50d4d5ac1c7a05eceb8d57d3c1169889
diff --git a/breakChange-2.x.md b/breakChange-2.x.md
index 7fbbf9020..407ca9a80 100644
--- a/breakChange-2.x.md
+++ b/breakChange-2.x.md
@@ -51,3 +51,11 @@ v-model -> v-model:visible
## Steps
v-model -> v-model:current
+
+## checkbox
+
+v-model -> v-model:checked
+
+checkboxGroup
+
+v-model -> v-model:value
diff --git a/components/checkbox/Checkbox.jsx b/components/checkbox/Checkbox.jsx
index fe4661259..80403e2de 100644
--- a/components/checkbox/Checkbox.jsx
+++ b/components/checkbox/Checkbox.jsx
@@ -2,9 +2,10 @@ import { inject } from 'vue';
import PropTypes from '../_util/vue-types';
import classNames from 'classnames';
import VcCheckbox from '../vc-checkbox';
-import hasProp, { getOptionProps } from '../_util/props-util';
+import hasProp, { getOptionProps, getSlot } from '../_util/props-util';
import { ConfigConsumerProps } from '../config-provider';
import warning from '../_util/warning';
+function noop() {}
export default {
name: 'ACheckbox',
@@ -64,7 +65,8 @@ export default {
methods: {
handleChange(event) {
const targetChecked = event.target.checked;
- this.$emit('input', targetChecked);
+ this.$emit('update:checked', targetChecked);
+ // this.$emit('input', targetChecked);
this.$emit('change', event);
},
focus() {
@@ -77,12 +79,19 @@ export default {
render() {
const props = getOptionProps(this);
- const { checkboxGroupContext: checkboxGroup, $slots, $attrs } = this;
- const children = $slots.default && $slots.default();
+ const { checkboxGroupContext: checkboxGroup, $attrs } = this;
+ const children = getSlot(this);
const { indeterminate, prefixCls: customizePrefixCls, ...restProps } = props;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('checkbox', customizePrefixCls);
- const { onMouseenter, onMouseleave, onInput, class: className, style, ...restAttrs } = $attrs;
+ const {
+ onMouseenter = noop,
+ onMouseleave = noop,
+ onInput,
+ class: className,
+ style,
+ ...restAttrs
+ } = $attrs;
const checkboxProps = {
...restProps,
prefixCls,
diff --git a/components/checkbox/Group.jsx b/components/checkbox/Group.jsx
index 99f3d4415..e65265a2f 100644
--- a/components/checkbox/Group.jsx
+++ b/components/checkbox/Group.jsx
@@ -1,15 +1,12 @@
import { inject, provide } from 'vue';
import PropTypes from '../_util/vue-types';
import Checkbox from './Checkbox';
-import hasProp from '../_util/props-util';
+import hasProp, { getSlot } from '../_util/props-util';
import { ConfigConsumerProps } from '../config-provider';
function noop() {}
export default {
name: 'ACheckboxGroup',
- model: {
- prop: 'value',
- },
props: {
name: PropTypes.string,
prefixCls: PropTypes.string,
@@ -17,6 +14,7 @@ export default {
value: PropTypes.array,
options: PropTypes.array.def([]),
disabled: PropTypes.bool,
+ onChange: PropTypes.func,
},
data() {
@@ -31,9 +29,13 @@ export default {
this.sValue = val || [];
},
},
+ setup() {
+ return {
+ configProvider: inject('configProvider', ConfigConsumerProps),
+ };
+ },
created() {
- (this.configProvider = inject('configProvider', ConfigConsumerProps)),
- provide('checkboxGroupContext', this);
+ provide('checkboxGroupContext', this);
},
methods: {
getOptions() {
@@ -79,16 +81,17 @@ export default {
const indexB = options.findIndex(opt => opt.value === b);
return indexA - indexB;
});
- this.$emit('input', val);
+ // this.$emit('input', val);
+ this.$emit('update:value', val);
this.$emit('change', val);
},
},
render() {
- const { $props: props, $data: state, $slots } = this;
+ const { $props: props, $data: state } = this;
const { prefixCls: customizePrefixCls, options } = props;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('checkbox', customizePrefixCls);
- let children = $slots.default;
+ let children = getSlot(this);
const groupPrefixCls = `${prefixCls}-group`;
if (options && options.length > 0) {
children = this.getOptions().map(option => (
diff --git a/components/grid/Col.jsx b/components/grid/Col.jsx
index 68b604b06..48aae440d 100644
--- a/components/grid/Col.jsx
+++ b/components/grid/Col.jsx
@@ -1,6 +1,7 @@
import { inject } from 'vue';
import PropTypes from '../_util/vue-types';
import { ConfigConsumerProps } from '../config-provider';
+import { getSlot } from '../_util/props-util';
const stringOrNumber = PropTypes.oneOfType([PropTypes.string, PropTypes.number]);
@@ -39,16 +40,7 @@ export default {
};
},
render() {
- const {
- span,
- order,
- offset,
- push,
- pull,
- prefixCls: customizePrefixCls,
- $slots,
- rowContext,
- } = this;
+ const { span, order, offset, push, pull, prefixCls: customizePrefixCls, rowContext } = this;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('col', customizePrefixCls);
@@ -104,6 +96,6 @@ export default {
};
}
}
- return {$slots.default && $slots.default()}
;
+ return {getSlot(this)}
;
},
};
diff --git a/components/grid/Row.jsx b/components/grid/Row.jsx
index a5fb2e4ad..0ba0f7722 100644
--- a/components/grid/Row.jsx
+++ b/components/grid/Row.jsx
@@ -3,6 +3,7 @@ import PropTypes from '../_util/vue-types';
import BaseMixin from '../_util/BaseMixin';
import { ConfigConsumerProps } from '../config-provider';
import ResponsiveObserve from '../_util/responsiveObserve';
+import { getSlot } from '../_util/props-util';
const RowProps = {
gutter: PropTypes.oneOfType([PropTypes.object, PropTypes.number, PropTypes.array]),
@@ -79,7 +80,7 @@ export default {
},
render() {
- const { type, justify, align, prefixCls: customizePrefixCls, $slots } = this;
+ const { type, justify, align, prefixCls: customizePrefixCls } = this;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('row', customizePrefixCls);
@@ -106,7 +107,7 @@ export default {
};
return (
- {$slots.default && $slots.default()}
+ {getSlot(this)}
);
},
diff --git a/components/statistic/Number.jsx b/components/statistic/Number.jsx
index ac104f8cd..74fb0ba13 100644
--- a/components/statistic/Number.jsx
+++ b/components/statistic/Number.jsx
@@ -45,6 +45,4 @@ const Number = (_, { attrs }) => {
return {valueNode};
};
-
-Number.name = 'AStatisticNumber';
export default Number;