介绍
Navigation 是一个为 Vue 和 React 打造的页面导航库,提供类似原生 App 的导航体验。
特性
🔄 栈式导航
采用页面栈的方式管理页面,支持:
push- 推入新页面back- 返回上一页replace- 替换当前页面blackBoxBack- 静默返回多层backToHome- 返回首页
👆 手势返回
从屏幕左边缘向右滑动即可触发返回操作,支持:
- 实时跟手的动画效果
- 可自定义的动画处理
- 可禁用手势返回
⚡ 流畅动画
基于 Anime.js 实现的高性能动画:
- 页面推入/推出动画
- 侧边弹出动画
- 居中弹窗动画
- 自定义动画支持
🦸 Hero 动画
跨页面元素共享动画,实现流畅的视觉过渡效果。
🎯 生命周期
丰富的页面生命周期钩子:
onWillAppear- 页面即将显示onDidAppear- 页面已显示onWillDisappear- 页面即将消失onDidDisappear- 页面已消失
📱 移动端适配
- Safe Area 安全区域组件
- 禁用页面滚动时的 pointer events
- 适配各种移动端浏览器
框架支持
| 框架 | 包名 |
|---|---|
| Vue 3 | @0x30/navigation-vue |
| React 18 | @0x30/navigation-react |
| Core (框架无关) | @0x30/navigation-core |