uni-app如何实现页面预加载?

uni.preloadPage(OBJECT)

预加载页面,是一种性能优化技术。被预载的页面,在打开时速度更快。

属性类型必填说明
urlstring预加载页面url
completeFunction预加载成功完成回调
failFunction预加载失败回调

H5 平台

预加载 /pages/test/test 对应的js文件,不执行页面预渲染逻辑

uni.preloadPage({url: "/pages/test/test"});

App-nvue 平台

预加载nvue页面 /pages/test/test

uni.preloadPage({url: "/pages/test/test"});

注意事项

  1. App平台仅支持预加载 nvue 页面,执行页面预渲染,预载时触发生命周期 onLoadonReady,不触发 onShow
  2. 打开新页面时,url 完全相同(包含参数)时,优先使用预加载页面,触发生命周期 onShow
  3. tabbar页面,仅支持预加载尚未显示过的页面,否者返回 fail,提示 already exists
  4. 同一时间,相同 url 仅 preloadPage 一次
  5. 当同一个预载页面已被打开(在路由栈),再次打开相同url时,不再使用该预加载页面,而是打开新的非预载页面
  6. uni.reLanuchuni.switchTabuni.navigateBack(含Android返回键) 切换页面时,预加载页面不会被销毁,仅触发生命周期 onHide
  7. 在预载页面使用 uni.redirectTo 时,预加载页面会被销毁,触发生命周期 onUnload

原文查看:https://uniapp.dcloud.io/

 

  • 4
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Uni-app是一种基于Vue.js框架的跨平台应用开发框架,它可以帮助开发者在一次编写的代码基础上,同时生成多个平台(如iOS、Android、Web等)的应用。在使用uni-app开发微信小程序时,可以很方便地实现敲木鱼功能。开发者可以使用uni-app提供的组件和API来实现敲击手机屏幕时播放木鱼声音的效果。具体实现方式可以参考uni-app官方文档和教程,这里提供了一种简单的实现思路: 1. 首先,在uni-app项目中创建一个页面,用于展示敲木鱼的界面。 2. 在该页面的模板中,可以使用uni-app提供的组件,例如`<view>`、`<button>`等,来实现界面的布局和交互。 3. 使用uni-app提供的音频组件,如`<audio>`,设置音频源为木鱼声音文件。可以在页面加载加载音频,或者在敲击木鱼时动态加载音频。 4. 在按钮的点击事件中,使用uni-app提供的API,如`uni.showToast()`等方法,来实现敲木鱼时的交互效果,如显示提示信息、播放音频等。 5. 可以通过调整音频的音量、音色等参数来实现用户可调节的功能。可以使用uni-app提供的滑动选择器组件,如`<picker>`,来实现用户选择音量、音色等参数的界面。 6. 如果需要实现计时器功能,可以使用uni-app提供的定时器功能,如`setInterval()`方法,来实现定时播放木鱼声音的效果。 综上所述,使用Uni-app开发敲木鱼功能的微信小程序非常简单。开发者只需要利用Uni-app提供的组件和API,结合自己对敲木鱼功能的需求进行相应的编码即可。希望以上信息对您有帮助。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值