Peut-être une erreur de l'utilisateur ici, mais peut-être pas. Utiliser ECMA2015 + babel si c'est important.
return (
<div className={curtainClasses} style={this.props.curtainClass ? null : curtainStyle} onClick={this.props.clickHandler}>
<div key="_srm-modal" style={this.props.modalClass ? null : modalStyle} className={modalClasses}>
{this.props.children}
</div>
</div>
);
rend (dans mon application):
<div class="_srm-curtain modal-background" data-reactid=".0.0.1.1.0.0">
<div class="modal-pod" data-reactid=".0.0.1.1.0.0.$_srm-modal">
<h1 data-reactid=".0.0.1.1.0.0.$_srm-modal.0">Hello World</h1>
</div>
</div>
Cependant, si j'essaie de jouer avec un CSSTransitionGroup :
let ReactCSSTransitionGroup = React.addons.CSSTransitionGroup;
return (
<div className={curtainClasses} style={this.props.curtainClass ? null : curtainStyle} onClick={this.props.clickHandler}>
<ReactCSSTransitionGroup transitionName={this.props.transitionName}>
<div key="_srm-modal" style={this.props.modalClass ? null : modalStyle} className={modalClasses}>
{this.props.children}
</div>
</ReactCSSTransitionGroup>
</div>
);
rend avec ces étendues supplémentaires :
<div class="_srm-curtain modal-background" data-reactid=".0.0.1.1.0.0">
<span data-reactid=".0.0.1.1.0.0.0">
<div class="modal-pod" data-reactid=".0.0.1.1.0.0.0.$=1$_srm-modal">
<h1 data-reactid=".0.0.1.1.0.0.0.$=1$_srm-modal.0">Hello World</h1>
</div>
</span>
</div>
Si je fais quelque chose de mal, merci de m'indiquer la bonne direction ! Peut-être qu'il y avait une note dans la doc que j'ai ratée !
Merci les gars, continuez votre excellent travail!
Je crois que c'est le comportement documenté du CSSTransitionGroup
.
Merci beaucoup! J'ai raté cette signature ! @garetht
Ce problème a peut-être été résolu, mais l'utilisation de React.Fragment en tant que propriété de composant a résolu le problème pour moi.
<ReactCSSTransitionGroup
component={React.Fragment}
transitionName="slide"
transitionEnterTimeout={500}
transitionLeaveTimeout={500}
>
....
</ReactCSSTransitionGroup>
Commentaire le plus utile
Ce problème a peut-être été résolu, mais l'utilisation de React.Fragment en tant que propriété de composant a résolu le problème pour moi.