我正在创建一个小部件仪表板，您可以在其中移动小部件，我的目标是在拖动小部件后保留它们的位置，以便在将来的会话中将它们加载到完全相同的位置。
这里有一个codesandbox，它说明了我在使用framer-motion时遇到的问题：https://codesandbox.io/p/sandbox/interesting-sun-p8h6cu。
小部件上的初始 top 和 left 值正确反映了其起始位置，但在拖动它后我无法保留其新位置。
我正在更新 onDragEnd 处理程序中小部件的位置，该处理程序又更新小部件上的 top 和 left 样式。通过 Framer-motion 使用 transform:translate 进行拖动并更新定位样式，这会产生一个小部件：
top left 样式使 transform:translate 拖动样式的效果加倍。我不知道如何解决这个问题。我尝试使用 transform:translate 进行初始定位，但它不起作用。另外，现在我认为一旦被拖动，成帧器运动就会覆盖它，从而导致不同的不需要的行为。
TLDR：我在显示绝对定位的组件时遇到问题，这些组件可通过 Framer-motion 的拖动功能进行拖动
您说得对，
top和left会加倍，因为 Framer 拖动功能正在改变x和y。由于您随后将 xy 变换应用于顶部和左侧，因此您会得到意想不到的结果。如果您只更改
x和y，一切都应该保持同步。style={{ x: widget.x, y: widget.y }}而不是
style={{ left: widget.x, top: widget.y }}