相关疑难解决方法(0)

React TransitionGroup和React.cloneElement不发送更新的道具

我正在关注Chang Wang的教程,使用HOC和ReactTransitionGroup(第1 部分第2部分)与Huan Ji的页面转换教程(Link)一起制作可重复使用的React过渡.

我面临的问题是,React.cloneElement似乎没有将更新的道具传递给其中一个孩子,而其他孩子正确地接收更新的道具.

首先,一些代码:

TransitionContainer.js

TransitionContainer是一个容器组件,类似于AppHuan Ji的教程.它为它的孩子注入一片状态.

这些孩子TransitionGroup都是HOC的一个实例Transition(代码进一步向下)

import React from 'react';
import TransitionGroup from 'react-addons-transition-group';
import {connect} from 'react-redux';
class TransitionContainer extends React.Component{
  render(){
    console.log(this.props.transitionState);
    console.log("transitionContainer");
    return(
      <div>
      <TransitionGroup>
      {
        React.Children.map(this.props.children,
         (child) => React.cloneElement(child,      //These children are all instances of the Transition HOC
           { key: child.props.route.path + "//" + child.type.displayName,
             dispatch: this.props.dispatch,
             transitionState: this.props.transitionState
           }
         )
        )
      }

      </TransitionGroup>
      </div>
    )
  } …
Run Code Online (Sandbox Code Playgroud)

animation reactjs react-router reactcsstransitiongroup redux

11
推荐指数
1
解决办法
3838
查看次数