为了降低开发成本,基础库预设了一批常见的路由动画效果。
| routeType | 最低基础库版本 |
|---|---|
wx://bottom-sheet | 3.1.0 |
wx://upwards | 3.1.0 |
wx://zoom | 3.1.0 |
wx://cupertino-modal | 3.1.0 |
wx://cupertino-modal-inside | 3.1.0 |
wx://modal-navigation | 3.1.0 |
wx://modal | 3.1.0 |
使用方法
只需要在路由跳转时,指定对应的 routeType 即可。
注意:以上路由效果都可以通过自定义路由来实现,可以参考示例代码中的源码文件,自定义你需要的效果。
wx.navigateTo({
url: 'xxx',
routeType: 'wx://modal'
})
示例代码
在开发者工具中预览效果
效果演示
wx://bottom-sheet
半屏弹窗
wx://upwards
向上进入
wx://zoom
放大进入
wx://cupertino-modal-inside
从 wx-cupertino-modal 跳转到 wx-cupertino-modal-inside
wx://modal-navigation
从 wx-cupertino-modal 跳转到 wx-modal-navigation
wx://modal
从 wx-modal 跳转到 wx-modal-navigation