对单个组件进行动画处理，使其随React Spring一起离开DOM？

Question

我正在使用React Spring在DOM内外添加组件动画。如果所有项目都具有相同的动画，那么这对我来说会很好：

    <Transition
      items={items}
      keys={item => item.id}
      from={{ opacity: 0 }}
      enter={{ opacity: 1 }}
      leave={{ opacity: 0 }}
    >
      {item => props => (
        <div style={props}>
          <Component {...item} />
        </div>
      )}
    </Transition>

但是，我需要针对每个组件分别控制delay和duration（基于状态），甚至还需要控制组件是否动画。

文档说“转换也可以包含一个项目”，但是我无法使其正常工作。

https://react-spring-renderprops.surge.sh/transition#/red

{
    items.map(item=>(
        <Transition
          items={item}
          from={{ opacity: 0 }}
          enter={{ opacity: 1 }}
          leave={{ opacity: 0 }}
        >
            {item => props => {
                // Custom logic could go here? 
                return(
                    <div style={props}>
                        <Component {...item} />
                    </div>
                )
            }}
        </Transition>
    )
}

请注意，我的items数组来自Redux，因此可以在外部添加/删除项目。