Framer Motion - 过时的自定义值 - 更改自定义值不会触发更新

Using 成帧器运动 https://www.framer.com/api/motion/，我有一个问题，更新我传递的对象custom支撑到motion.div变体不会触发预期的样式更改。

我创建了以下沙箱来演示该问题：

https://codesandbox.io/s/framer-motion-stale-custom-fibp5?file=/src/App.js https://codesandbox.io/s/framer-motion-stale-custom-fibp5?file=/src/App.js

我的期望是，当我切换主题时 - 圆圈的开/关颜色将立即根据新主题而改变。 （从黑/白到深蓝/黄，反之亦然）。

但是，主题更改仅在动画值更改后才会应用（状态从“打开”更改为“关闭”等），因此当我切换主题时，我会显示“陈旧”主题值，直到我也切换状态（开/关）。

任何帮助将不胜感激。

是的，看起来很出乎意料，也许这是一个错误。

不确定这是否适合您的用例，但您现在可以做的是使用 Reactkey支撑力motion.div主题更改后重新渲染。像那样：

      <motion.div
        key={theme}
        style={styles.circle}
        variants={VARIANTS}
        animate={status}
        initial={false}
        custom={theme}
      />

请注意，我还设置了initial={false}因为否则动画将开始于off如果您确实处于状态事件on.

代码沙箱：https://codesandbox.io/s/httpsstackoverflowcomquestions64027738-cwj9k?file=/src/App.js https://codesandbox.io/s/httpsstackoverflowcomquestions64027738-cwj9k?file=/src/App.js