【发布时间】：2020-12-02 12:52:26
【问题描述】：
当使用 CSS 过渡在数组中渲染 react 组件时，该数组将被重新排序并更改样式，我发现只有上升的元素有过渡，而下降的元素没有应用过渡。我希望所有元素在渲染后都会发生样式更改，应该保留过渡。
这是该问题的代码框https://codesandbox.io/s/youthful-fire-9zrc4
感谢任何帮助。提前致谢
【问题讨论】：
标签： javascript css reactjs css-transitions
【发布时间】：2020-12-02 12:52:26
【问题描述】：
你有错误的关键参数。如果键更改 react 会重新排序整个 DOM，从而破坏动画。
将第 6 行中的 key={opt.name} 更改为 key={i}
【讨论】：
-
我将键分配给选项项的唯一值，以保持它们在渲染前后的状态。使用索引作为键将适用于这种情况，但它会影响每个选项的状态