Browse Source

feat: update tag

pull/2415/head^2
tanjinzhou 5 years ago
parent
commit
41129be9b6
  1. 11
      breakChange-2.x.md
  2. 1
      components/tag/CheckableTag.jsx
  3. 28
      components/tag/Tag.jsx

11
breakChange-2.x.md

@ -0,0 +1,11 @@
## Tag
### CheckableTag
v-model -> v-model:checked
### Tag
v-model -> v-model:visible
移除 afterClose 属性

1
components/tag/CheckableTag.jsx

@ -7,6 +7,7 @@ export default {
props: {
prefixCls: PropTypes.string,
checked: PropTypes.bool,
onChange: PropTypes.func,
},
setup() {
return {

28
components/tag/Tag.jsx

@ -1,12 +1,10 @@
import { Transition, inject } from 'vue';
import { inject } from 'vue';
import CloseOutlined from '@ant-design/icons-vue/CloseOutlined';
import PropTypes from '../_util/vue-types';
import getTransitionProps from '../_util/getTransitionProps';
import Wave from '../_util/wave';
import { hasProp, getOptionProps } from '../_util/props-util';
import BaseMixin from '../_util/BaseMixin';
import { ConfigConsumerProps } from '../config-provider';
import warning from '../_util/warning';
const PresetColorTypes = [
'pink',
@ -33,7 +31,7 @@ export default {
color: PropTypes.string,
closable: PropTypes.bool.def(false),
visible: PropTypes.bool,
afterClose: PropTypes.func,
onClose: PropTypes.func,
},
setup() {
return {
@ -46,11 +44,6 @@ export default {
if ('visible' in props) {
_visible = this.visible;
}
warning(
!('afterClose' in props),
'Tag',
"'afterClose' will be deprecated, please use 'close' event, we will remove this in the next version.",
);
return {
_visible,
};
@ -66,11 +59,6 @@ export default {
setVisible(visible, e) {
this.$emit('close', e);
this.$emit('update:visible', false);
const afterClose = this.afterClose;
if (afterClose) {
// next version remove.
afterClose();
}
if (e.defaultPrevented) {
return;
}
@ -117,22 +105,16 @@ export default {
render() {
const { prefixCls: customizePrefixCls } = this.$props;
const isNeedWave = 'onClick' in this.$attrs;
const getPrefixCls = this.configProvider.getPrefixCls;
const prefixCls = getPrefixCls('tag', customizePrefixCls);
const { _visible: visible } = this.$data;
const tag = (
<span v-show={visible} class={this.getTagClassName(prefixCls)} style={this.getTagStyle()}>
{this.$slots.default()}
{this.$slots.default && this.$slots.default()}
{this.renderCloseIcon()}
</span>
);
const transitionProps = getTransitionProps(`${prefixCls}-zoom`, {
appear: false,
});
return (
<Wave>
<Transition {...transitionProps}>{tag}</Transition>
</Wave>
);
return isNeedWave ? <Wave>{tag}</Wave> : tag;
},
};

Loading…
Cancel
Save