杭州网站建设 博客,wordpress小程序源码,商城app开发费用多少钱,四川建设网评标专家库uni-app注意点记录
跳转到 tabBar 页面只能使用 switchTab 跳转路由API的目标页面必须是在pages.json里注册的vue页面。如果想打开web url#xff0c;在App平台可以使用 plus.runtime.openURL或web-view组件#xff1b;H5平台使用 window.open#xff1b;小程序平台使用web…uni-app注意点记录
跳转到 tabBar 页面只能使用 switchTab 跳转路由API的目标页面必须是在pages.json里注册的vue页面。如果想打开web url在App平台可以使用 plus.runtime.openURL或web-view组件H5平台使用 window.open小程序平台使用web-view组件url需在小程序的联网白名单中。
页面加载时序介绍
接下来我们介绍onLoad、onReady、onShow的先后关系页面加载的详细流程。 uni-app框架首先根据pages.json的配置创建页面 所以原生导航栏是最快显示的。页面背景色也应该在这里配置。 根据页面template里的组件创建dom。 这里的dom创建仅包含第一批处理的静态dom。对于通过js/uts更新data然后通过v-for再创建的列表数据不在第一批处理。
要注意一个页面静态dom元素过多会影响页面加载速度。在uni-app x Android版本上可能会阻碍页面进入的转场动画。 因为此时页面转场动画还没有启动。
触发onLoad 此时页面还未显示没有开始进入的转场动画页面dom还不存在。
所以这里不能直接操作dom可以修改data因为vue框架会等待dom准备后再更新界面在 app-uvue 中获取当前的activity拿到的是老页面的activity只能通过页面栈获取activity。
onLoad比较适合的操作是接受上页的参数联网取数据更新data。
手机都是多核的uni.request或云开发联网在子线程运行不会干扰UI线程的入场动画并行处理可以更快的拿到数据、渲染界面。
但onLoad里不适合进行大量同步耗时运算因为此时转场动画还没开始。
尤其uni-app x 在 Android上onLoad里的代码除了联网和加载图片默认是在UI线程运行的大量同步耗时计算很容易卡住页面动画不启动。除非开发者显式指定在其他线程运行。 转场动画开始 新页面开始进入的转场动画动画默认耗时300ms可以在路由API中调节时长。 页面onReady 第2步创建dom是虚拟domdom创建后需要经历一段时间UI层才能完成了页面上真实元素的创建即触发了onReady。
onReady后页面元素就可以自由操作了比如ref获取节点。同时首批界面也渲染了。
注意onReady和转场动画开始、结束之间没有必然的先后顺序完全取决于dom的数量和复杂度。
如果元素排版和渲染够快转场动画刚开始就渲染好了
大多情况下转场动画走几格就看到了首批渲染内容
如果元素排版和渲染过慢转场动画结束都没有内容就会造成白屏。
联网进程从onLoad起就在异步获取数据更新data如果服务器速度够快第二批数据也可能在转场动画结束前渲染。
转场动画结束 再次强调5和6的先后顺序不一定取决于首批dom渲染的速度。
性能优化
https://doc.dcloud.net.cn/uni-app-x/performance.html
