Skip to content

Commit

Permalink
fix 10445 (#10457)
Browse files Browse the repository at this point in the history
* fix 10445

* re help anim timing

* refactor

* use this.helpShow

* is show no set state

* remove state.helpShow
  • Loading branch information
jljsj33 authored and afc163 committed May 10, 2018
1 parent 1b8030e commit 9e01b24
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 6 deletions.
13 changes: 9 additions & 4 deletions components/form/FormItem.tsx
Expand Up @@ -55,7 +55,7 @@ export default class FormItem extends React.Component<FormItemProps, any> {

context: FormItemContext;

state = { helpShow: false };
helpShow = false;

componentDidMount() {
warning(
Expand Down Expand Up @@ -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() {
Expand All @@ -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"
Expand Down Expand Up @@ -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}
Expand Down
5 changes: 3 additions & 2 deletions components/form/style/index.less
Expand Up @@ -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 {
Expand Down Expand Up @@ -576,7 +577,7 @@ form {
}
}

.show-help-motion(show-help, antShowHelp, 0.15s);
.show-help-motion(show-help, antShowHelp, 0.3s);

@keyframes antShowHelpIn {
0% {
Expand Down

0 comments on commit 9e01b24

Please sign in to comment.