TransitionGroup

To transition an array of elements, use the TransitionGroup component. Please note that you have to set a unique key for each item in order to let React know which element has been added or removed.

<React.Fragment>
  <div
    style={
      Object {
        "display": "flex",
      }
    }
  >
    <Button
      onClick={[Function addItem]}
    >
      Add item
    </Button>
    <Button
      onClick={[Function removeItem]}
    >
      Remove item
    </Button>
  </div>
  <TransitionGroup
    type="FadeInRight"
  >
    <div
      style={
        Object {
          "background": "deeppink",
          "float": "left",
          "height": 100,
          "marginRight": 20,
          "marginTop": 20,
          "width": 100,
        }
      }
    >
      Thing 1
    </div>
  </TransitionGroup>
</React.Fragment>
Thing 1