* fix 10445

* re help anim timing

* refactor

* use this.helpShow

* is show no set state

* remove state.helpShow
This commit is contained in:
jiang 2018-05-10 21:48:11 +08:00 committed by 偏右
parent 1b8030ec59
commit 9e01b24272
2 changed files with 12 additions and 6 deletions

View File

@ -55,7 +55,7 @@ export default class FormItem extends React.Component<FormItemProps, any> {
context: FormItemContext;
state = { helpShow: false };
helpShow = false;
componentDidMount() {
warning(
@ -124,7 +124,10 @@ export default class FormItem extends React.Component<FormItemProps, any> {
}
onHelpAnimEnd = (_key: string, helpShow: boolean) => {
this.setState({ helpShow });
this.helpShow = helpShow;
if (!helpShow) {
this.setState({});
}
}
renderHelp() {
@ -135,6 +138,9 @@ export default class FormItem extends React.Component<FormItemProps, any> {
{help}
</div>
) : null;
if (children) {
this.helpShow = !!children;
}
return (
<Animate
transitionName="show-help"
@ -306,11 +312,10 @@ export default class FormItem extends React.Component<FormItemProps, any> {
const style = props.style;
const itemClassName = {
[`${prefixCls}-item`]: true,
[`${prefixCls}-item-with-help`]: !!this.getHelpMsg() || this.state.helpShow,
[`${prefixCls}-item-with-help`]: this.helpShow,
[`${prefixCls}-item-no-colon`]: !props.colon,
[`${props.className}`]: !!props.className,
};
return (
<Row className={classNames(itemClassName)} style={style}>
{children}

View File

@ -132,8 +132,9 @@ input[type="checkbox"] {
.@{form-prefix-cls}-extra {
color: @text-color-secondary;
line-height: @line-height-base;
transition: color .15s @ease-out;
transition: color .3s @ease-out; // sync input color transition
margin-top: @form-help-margin-top;
clear: both;
}
.@{form-prefix-cls}-extra {
@ -576,7 +577,7 @@ form {
}
}
.show-help-motion(show-help, antShowHelp, 0.15s);
.show-help-motion(show-help, antShowHelp, 0.3s);
@keyframes antShowHelpIn {
0% {