如何在Framer Motion中为退出动画设置独立的过渡类型

你可以在exit属性内部嵌套专属的transition配置，该配置优先级高于全局定义的transition，只会作用于退出动画阶段，不会影响initial和animate的过渡效果。

修改后的代码示例：

<motion.div
  initial={{opacity: 0, transform: 'scale(0.5)'}}
  animate={{opacity: 1, transform: 'scale(1)'}}
  exit={{
    opacity: 0,
    transform: 'scale(0.5)',
    // 单独定义退出动画的过渡效果，这里以tween类型为例，可自行调整参数
    transition: { type: "tween", duration: 0.3 }
  }}
  // 全局过渡仅作用于initial和animate状态
  transition={{ type: "spring", stiffness: 200 }}
></motion.div>

补充说明：initial、animate等所有状态属性都支持单独内嵌transition配置，优先级始终高于全局的transition属性，你可以按需给不同动画阶段设置完全独立的过渡规则。

内容的提问来源于stack exchange，提问作者shennan