微信小程序4,生命周期,wxs、导航 |
您所在的位置:网站首页 › 微信自带导航 › 微信小程序4,生命周期,wxs、导航 |
目录
生命周期生命周期的分类什么是生命周期函数生命周期函数分类应用生命周期函数页面生命周期函数
wxswxs与JavaScript的不同
导航声明式导航
编程式导航
生命周期(Life Cycle)是指一个对象从创建->运行->销毁的整个阶段,强调的是一个时间段。小程序的运行的过程,就是小程序的生命周期。
生命周期
生命周期的分类
应用生命周期,特指小程序从启动到运行再到销毁的过程页面生命周期,特指小程序中,每个页面的加载到渲染再到销毁的过程
其中,页面的生命周期范围较小,应用程序的生命周期范围较大。 什么是生命周期函数是由小程序框架提供的的内置函数,会伴随着生命周期,自动按次序执行。生周期函数的作用就是允许陈鼓学院在特定时间点,执行某些特定的操作。 注意:生命周期强调的是时间段,生命周期函数强调的是时间点。 生命周期函数分类 应用生命周期函数,特指小程序从启动到运行再到销毁的期间依次调用的函数页面生命周期函数,特指小程序中,每个页面的加载到渲染再到销毁的期间依次调用的函数 应用生命周期函数小程序的应用周期函数需要在app.js中进行说明。 onLaunch 当小程序初始化完成时,会触发 onLaunch(全局只触发一次)在这里可以对某些数据进行初始化,比如将本地存储的数据加载在小程序中。onShow 当小程序启动,或从后台进入前台显示,会触发 onShowonHide 当小程序从前台进入后台,会触发 onHide前台后台即是小程序的运行状态 页面生命周期函数小陈故乡的页面生命周期函数需要在页面的.js文件中进行声明 onLoad 监听页面加载,一个页面只调用一次onShow 监听页面显示onReady 监听页面初次渲染完成,一个页面只能调用一次onHide 监听页面移仓onUnload 监听页面卸载,一个页面只调用一次 wxswxs是一门类似于javascript的脚本语言,但本质上两者不同,内嵌形式的wxs编写在wxml文件中标签内,必须提供一个module属性,用来指定当前wxs的模块名称,方便wxml中访问模块中的成员。 {{m1.toUpper(username)}} module.exports.toUpper = function(str){ return str.toUpperCase() }wxs代码还可以编写在以wxs为后缀名的文件内,就像javascript代码可以编写在.js为后缀名的文件中一样。 function toLower(str){ return str.toLowerCase() } module.exports={ toLower:toLower }在wxml中引入外联的wxs脚本时,必须为标签添加module和src属性,其中module用来指定模块的名称,src用来指定引入的脚本路径,且必须是相对路径。 {{m2.toLower(username2)}} wxs与JavaScript的不同wxs典型的应用场景就是“过滤器”,经常配合Mustache语法进行使用,但是不能将定义的函数作为组件的事件回调函数。 具有隔离性,指的是wxs代码的运行环境和其他JavaScript代码是隔离的。主要体现在: wxs不能调用js中定义的函数wxs不能调用小程序提供的API性能好,主要体现在ios设备上,小程序的wxs会比JavaScript代码快2~20倍,安卓上无差异。 导航 声明式导航使用navigator进行页面链接。 target:在哪个目标上发生跳转,默认当前小程序 self 当前小程序miniProgram 其它小程序 url:当前小程序内的跳转链接open-type:跳转方式 navigate 保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。redirect 关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。switchTab 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面reLaunch 关闭所有页面,打开到应用内的某个页面navigateBack 关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈,决定需要返回几层。exit 退出小程序,target="miniProgram"时生效 delta 当 open-type 为 ‘navigateBack’ 时有效,表示回退的层数app-id 当target="miniProgram"且open-type="navigate"时有效,要打开的小程序 appIdpath 当target="miniProgram"且open-type="navigate"时有效,打开的页面路径,如果为空则打开首页extra-data 当target="miniProgram"且open-type="navigate/navigateBack"时有效,需要传递给目标小程序的数据,目标小程序可在 App.onLaunch(),App.onShow() 中获取到这份数据。hover-class 指定点击时的样式类,当hover-class="none"时,没有点击态效果hover-stop-propagation 指定是否阻止本节点的祖先节点出现点击态hover-start-time 按住后多久出现点击态,单位毫秒 编程式导航写法: wx.switchTab({ url: '/index' }) wx.navigateTo、 wx.navigateToMiniProgram 保留当前页面,跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 wx.navigateBack 可以返回到原页面。小程序中页面栈最多十层。wx.redirectTo关闭当前页面,跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。wx.switchTab 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面wx.reLaunch关闭所有页面,打开到应用内的某个页面wx.navigateBack、 wx.navigateBackMiniProgram 关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈,决定需要返回几层。wx.exitMiniProgram 退出当前小程序。必须有点击行为才能调用成功。 |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |