Реагировать CSStransition не применяется

Question

Я новичок, чтобы реагировать. Я пытаюсь научиться реагировать-группа перехода. Я слежу за учебником в Интернете. Не могли бы вы помочь мне или сказать, почему этот код не работает вообще? В соответствии с руководством на вкладке консоли, мой div должен иметь разные имена классов при добавлении / удалении (я еще не применял стили css - мне нужно только изменить имя класса).

/*Basket*/
    <TransitionGroup 
                component={BasketItem}  
                removeBasket={this.props.removeBasket}
                items={items}
                key={key}
                index={key}
                timeout={{enter: 5000, exit: 5000}} 
              />

/*Basket item*/
      <CSSTransition 
                    timeout={5000}
                    className="basket-item" 
                    key={key} >
                    <div key={key}>
                      <p> div content </p>
                    </div>
    </CSSTransition>

Answer 1

Что-то подсказывает мне, что у вас должно быть CSSTransition внутри TransitionGroup:

<TransitionGroup ...>
    <CSSTransition ...>
        <div>...</div>
    </CSSTransition>
</TransitionGroup>

Теперь у вас есть

<TransitionGroup .../>

<CSSTransition ...>
    <div>...</div>
</CSSTransition>

Что эквивалентно

<TransitionGroup ...>
</TransitionGroup>

<CSSTransition ...>
    <div>...</div>
</CSSTransition>