Skip to content

关于react-transition-group的一些问题 #120

@XYH1996

Description

@XYH1996

204页讲到的TransitionGroup要发挥作用必须自身已经完成装载
todoList的render函数:

  <TransitionGroup transitionName="fade" transitionEnterTimeout={500} transitionLeaveTimeout={200}>
{
  todos.map((item) => (
    <TodoItem
      key={item.id}
      id={item.id}
      text={item.text}
      completed={item.completed}
    />
    ))
}
  </TransitionGroup>
</ul>

那么TransitionGroup完成装载(componentDidMount)的时候,todoItem肯定已经先于此方法被装载了,而之后该组件才完成装载,这与书上说的完全装载才能发挥作用,不是矛盾了么?

我自己在todoItem里面实现了205页所说的在todoItem里面使用的情况发现也是会有动画的,render函数如下:

<CSSTransition key={id} timeout={500} classNames="item" > <li> do something </li> </CSSTransition>
望老师解答

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions