在这个答案
http://stackoverflow.com/a/26789089/883571中有一个模态，它通过将它附加到< body>创建一个基于React的模态。但是，我发现它与React提供的转换插件不兼容。
如何创建一个过渡(在进入和离开)？
在react conf 2015，Ryan Florence
demonstrated using portals.以下是如何创建一个简单的门户组件…
原文链接：https://www.f2er.com/react/302344.htmlvar Portal = React.createClass({
render: () => null,portalElement: null,componentDidMount() {
var p = this.props.portalId && document.getElementById(this.props.portalId);
if (!p) {
var p = document.createElement('div');
p.id = this.props.portalId;
document.body.appendChild(p);
}
this.portalElement = p;
this.componentDidUpdate();
},componentWillUnmount() {
document.body.removeChild(this.portalElement);
},componentDidUpdate() {
React.render(<div {...this.props}>{this.props.children}</div>,this.portalElement);
}
});
然后你可以通常在React中所做的一切，你可以在门户内做什么…
<Portal className="DialogGroup">
<ReactCSSTransitionGroup transitionName="Dialog-anim">
{ activeDialog === 1 &&
<div key="0" className="Dialog">
This is an animated dialog
</div> }
</ReactCSSTransitionGroup>
</Portal>
你也可以看看Ryan的react-modal，虽然我没有实际使用它，所以我不知道它是如何工作与动画。
