如何将 useTransition 侧边栏定位到最右侧

Question

我试图将此侧边栏的位置与它当前所做的相反。我希望侧边栏从右侧进入并始终保持正确。没有离开。

这是供您重现的沙盒链接 - https://codesandbox.io/s/react-spring-sidebar-transition-forked-igmgr。

谢谢。

Answer 1

首先将侧边栏放在右侧。

.sidebar {
  position: absolute;
  right:0;
}

将变换更改为正 x 方向

from: {
  transform: "translateX(100%)"
},
enter: {
  transform: `translateX(0)`
},
leave: {
  transform: "translateY(100%)"
},