vercel-react-view-transitions
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 中实现流畅的页面过渡动画。
npx oh-my-skill add vercel-labs/agent-skills/vercel-react-view-transitionscurl -fsSL https://oh-my-skill.com/install.sh | bash -s -- vercel-labs/agent-skills/vercel-react-view-transitionsnpx oh-my-skill verify vercel-labs/agent-skills/vercel-react-view-transitions怎么用
商店整理自技能原文 · 版本 f8a72b9 · 表述以原文为准安装后,Claude 会指导你使用 React 的 View Transition API 在页面切换、列表重排、组件进出场等场景添加动画。它会教你用 `<ViewTransition>` 组件声明动画目标,用 `startTransition` 等触发动画,并用 CSS 控制动画效果。
当你提到“页面过渡”、“视图过渡”、“startViewTransition”、“ViewTransition”等关键词,或要求实现页面切换动画、共享元素动画、列表重排动画、组件进出场动画、Next.js 视图过渡时触发。