Javascript ReactTransitionGroup不'；t与React redux连接的组件一起工作

我正在做一个更大的项目，但我创建了这个简短的例子来说明这个问题

如果我使用

Box

组件，它会工作。它将在控制台

组件中输入
和
当我们点击按钮时，组件将离开

如果我使用
BoxContainer
container，它就不再工作了
componentWillEnter
和
componentWillLeave
不调用特殊的生命周期挂钩

{this.state.shouldShowBox&&}

网页包构建正确，控制台中没有错误，但它没有输出任何内容

我还尝试使用高级API：
reactcstransitiongroup
，它可以使用
Box
和
BoxContainer
组件。但是我需要使用低级API：
ReactTransitionGroup

您知道为什么我们使用
react-redux
时它不起作用吗

使用的版本：

反应：15.0.2
redux:3.5.2
反应重复次数：4.4.5

代码：
从“React”导入React；
从'react dom'导入{render}；
从'react redux'导入{Provider，connect}；
从'redux'导入{createStore，compose，combinereducer}；
从“react/lib/ReactTransitionGroup”导入TransitionGroup；
//箱形元件
类框扩展了React.Component{
componentWillEnter（回调）{
console.log（'componentWillEnter'）；
回调（）；
}
组件将离开（回调）{
console.log（'componentwillleft'）；
回调（）；
}
render（）{
返回；
}
}
//盒连接元件
const-BoxContainer=connect（null，{}）（Box）；
//应用程序组件
类应用程序扩展了React.Component{
状态={
shouldShowBox：正确
};
切换框=（）=>{
这是我的国家({
shouldShowBox:！this.state.shouldShowBox
});
};
render（）{
返回(
{this.state.shouldShowBox&}
切换
);
}
}
//减速器
函数缩减器（状态=[]，操作）{
开关（动作类型）{
违约：
返回状态
}
}
//贮藏
const store=createStore（reducer）；
//渲染
渲染(
,
document.getElementById（'root'））
);
这是不应该工作的，因为connect将组件包装到一个“connected”对象中，但是，有一些解决方法，如

Redux的创始人丹·阿布拉莫夫（Dan Abramov）曾说过这句话

老实说，我不想硬编码支持
将组转换为connect（）。这是一个非常特定的API
不会成为React动画API，更像是一个转义
孵化，直到有更好的解决方案。它调用实例的方式
嵌套实例上的方法与对象不对齐
模特做得很好

我建议你：


或者按照您的建议，围绕connect（）编写自己的包装器

或者对动画使用更友好的方法，例如


按照您的建议，围绕connect（）编写自己的包装器，或者
对动画使用更友好的方法，例如

我们还尝试做同样的事情，将
TransitionGroup
与
redux
连接的组件连接起来，比如

<TransitionGroup>
  layerIds.map(id => ( <Layer ...>))
</TransitionGroup>

并使用
WrappedLayer
将其连接起来，它将只在安装阶段工作，如
componentwillbeen
和
componentdidsbeen
，不会在卸载阶段工作，因为当您删除UI上的层时，
TransitionGroup
也会被删除，然后像
组件这样的生命周期方法将永远不会被触发

好消息是，我们终于找到了一个非常方便的库
react move
，我们认为它比
react motion
更好，因为我们可以自定义持续时间、动画曲线，而且它非常干净

如果您使用
react move
遇到任何问题，请发送消息给我，希望这会对您有所帮助

const WrappedLayer = (props) =>{
  return <TransitionGroup>
  <Layer {...props}/>
  </TransitionGroup>
}