vercel-react-view-transitions
使用React的View Transition API(`<ViewTransition>`组件、`addTransitionType`以及CSS视图过渡伪元素)实现流畅、原生感动画的指南。当用户想要添加页面过渡、为路由变化添加动画、创建共享元素动画、为组件的进入/退出添加动画、为列表重排添加动画、实现方向性(前进/后退)导航动画,或在Next.js中集成视图过渡时,使用此技能。当用户提到视图过渡、`startViewTransition`、`ViewTransition`、过渡类型,或询问如何在React中不借助第三方动画库在UI状态之间添加动画时,也可使用。
机器翻译查看英文原文
Guide for implementing smooth, native-feeling animations using React's View Transition API (`<ViewTransition>` component, `addTransitionType`, and CSS view transition pseudo-elements). Use this skill whenever the user wants to add page transitions, animate route changes, create shared element animations, animate enter/exit of components, animate list reorder, implement directional (forward/back) navigation animations, or integrate view transitions in Next.js. Also use when the user mentions view transitions, `startViewTransition`, `ViewTransition`, transition types, or asks about animating between UI states in React without third-party animation libraries.
适用对象:React / Next.js。自动收录 · 待核查。
在 Claude Code 中使用
该组合的专门教程待补充,尚未核实适配。
准备条件
- 本条仅收录原作者的技能元数据;请阅读完整说明,确认依赖、许可与使用条件。
选择已有说明的 AI 工具,或在页面加载后保存待办及提出教程请求。
查看原作者说明 ↗