Javascript 为什么React组件上的CSS转换只在一个方向上工作？

我有4个div，我想在按下向左或向右箭头键时移动其中一个div。这个移动应该是一个过渡，而不是瞬间的，但是出于某种原因，这个过渡只有在我向左移动时才起作用

我原以为这与

键

道具或divs被卸载有关，但在尝试了一系列不同的事情后，我不再确定了

请看一看:

---

有人知道发生了什么吗？

在样式设置中，您只添加了

过渡：左0.3s

。因此，它不适用于正义。您可以将其更改为

transition:all 0.3

.tile {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  background-color: lightgrey;
  font-size: 32px;
  transition: all 0.3s ease;
}

---

我没有使用

right

来定位磁贴，只使用

left

，因此没有理由这样做。你可以自己试试，看看它不会改变什么。