小知识,大挑战!本文正在参与“程序员必备小知识”创作活动
最近在做uni-app项目,正好做下总结,发现uni-app相比vue而言,只是几个生命周期方法的不同还有传参之类的区别。至于div => view,img => image,px => rpx这样的标签上的细微区别就不一一说明了
uni-app生命周期:
uni-app页面的加载过程是 : 加载-显示-加载完成-页面隐藏-页面卸载
页面生命周期的出发过程: onLoad:监听页面加载 => onShow:监听页面显示 => onReady:监听页面初次渲染完成 => onHide:监听页面隐藏 => onUnload:监听页面卸载
在uni-app项目里面也可以使用vue的所有生命周期函数
onLoad: 只加载一次,监听页面加载,其参数为上个页面传递的数据,参数类型为Object(用于页面传参)
onShow: 监听页面显示。页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面 onload
onReady 监听页面初次渲染完成
onHide 监听页面隐藏
onUnload 监听页面卸载
路由跳转及传参
uni-app使用 uni.navigateTo进行路由跳转,例:uni.navigateTo({ url: 'test?id=1'}); navigateBack进行路由回退 uni.navigateBack({ delta: 2}); delta 是回退次数 接收参数在onLoad中用options接收,option为object类型,会序列化上个页面传递的参数
例:onLoad(options){ let id = options.id }
交互反馈
几个项目用的交互反馈,官网有详解