微信小程序的生命周期和路由
时间:2020-08-06 09:22:13
收藏:0
阅读:95
小程序的生命周期
1.整体小程序的生命周期:
1 App({ 2 3 onLaunch() {}, 监听小程序初始化,只触发一次 4 onShow(){},小程序启动或切换到前台运行 5 onHide(),小程序切换到后台运行 6 7 })
2.小程序页面中的生命周期
1 Page({ 2 //页面创建完,只触发一次,通常获取后台数据或接收另一个页面的传参时使用 3 onLoad() { 4 //一般获取数据是在这个生命周期中进行的 5 }, 6 //进入页面就会触发 7 onShow() {}, 8 //页面离开时触发 9 onHide() {}, 10 //监听页面初次渲染完成 11 onReady() {}, 12 //监听页面卸载,类似于vue中destroyed 13 onUnload() {} 14 onReachBottom() { 15 console.log(‘到底页面底部‘) 16 }, 17 //下拉触发 18 onPullDownRefresh() { 19 console.log(‘onPullDownRefresh‘) 20 }, 21 //点击右上角分享时触发 22 onShareAppMessage() { 23 24 } 25 })
3.微信小程序的路由
1 两种路由触发模式: 2 3 1.标签方式触发 4 5 小程序:<navigator url="要中转的路径?key=value"> 6 7 接收:通过另一个页面在onload生命周期中接收 8 9 2.编程式触发 10 小程序跳转: 11 wx.navigateTo() //带历史回退 12 wx.redirectTo() //不保留历史,跳转到另一个页面,不能返回到上一页面 13 wx.switchTab() //只跳转到tabBar页面,不带回退 14 wx.reLaunch() //即能跳转到tabBar页面,也能跳转到非tabBar页面,不带历史回退
4.小程序的数据请求
1 wx.request({ 2 url:‘‘, //请求的接口地址 3 method:‘get|post|put|delete‘,//请求方式 4 header:{},//设置请求头 5 data:{}, //传参 6 success() {}, //成功返回 7 fail() {},// 失败返回 8 9 }) 10 11 //注意: 12 //1.小程序请求的接口必须是https协议,不能请求本地的数据 13 //2. 请求接口之前要提前配置接口请求: 14 //第一种方法:在微信小程序后台配置request合法域名 15 //第二种方法:在开发者工具--详情--本地配置--勾选‘不校验合法域名’ 16 //3.请求成功和失败的回调最好写成箭头函数的形式 17 //普通函数的话 this指向的是钩子函数 请求回来的数据用this.setData时会出错 18 //加一个let _this=this 就可以了 19 //箭头函数的形式可以完全避免这种麻烦
评论(0)