E企盈营销工具技术服务商 热线:4006-838-530

微信小程序的事件乐都县E企盈小程序及生命周期(3)

继续下节课,今天我们还是从四个方面来了解小程序:  开通草席小程序电话:4006-838-530 ●常用事件和事件冒泡  ●配置  ●app生命周期及app对象的使用  ●页面的生命周期  一、事件的绑定:  事件一方面可以理解成用户的行为,当用户对UI层做了某些操作时,程序可以捕捉到操作的类型。如:点击、长按、移动等。另一方面事件也是一种通讯方式,比如当程序运行时来电话、短信通知时会改变当前程序的生命周期。常用的事件类别主要有: ●点击事件:Tap ●长按事件:longTap ●触摸事件:touchstart、touchend、touchmove、touchcancel ●其他事件:submit input 等  点击事件、长按事件、触摸事件都属于冒泡事件,其他事件属于非冒泡事件。冒泡事件即事件会从发生事件的组件向上传递。例:  事件的绑定方式:  1. bind    (会造成事件冒泡)  2. catch    (不会造成事件冒泡)  事件对象:   调用事件方开通New小程序电话:4006-838-530法是可以传入event参数,通过控制台可以看出event中所包含的对象,如下图可以更好的看出事件的冒泡机制:  二、配置   微信小程序的配置文件是以.json为后缀,分为全局配置和页面配置,全局配置是在app.json中,页面配置是在每个文件夹下的*.json中,配置项相同是页面配置会覆盖全局配置,包括样式文件也是如此。app.json文件来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。如下图所示:   app.json 配置项列表:   由于小程序版本更新迭代很快,具体配置项的使用方法请查看开发文档:https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html  三、app生命周期及app对象的使用    App生命周期和对象是在全局app.js中定义的,如图所示做以下修改:  运行结果如下:  app生命周期说明:属性类型描述触发时机onLaunchFunction生命周期函数–监听小程序初始化当小程序初始化完成时,会触发 onLaunch(全局只触发一次)onShowFunction生命周期函数–监听小程序显示当小程序启动,或从后台进入前台显示,会触发 onShowonHideFunction生命周期函数–监听小程序隐藏当小程序从前台进入后台,会触发 onHide其他Any开发者可以添加任意的函数或数据到 Object 参数中,用 this 可以访问   前台、后台定义: 当用户点击左上角关闭,或者按了设备 Home 键离开微信,小程序并没有直接销毁,而是进入了后台;当再次进入微信或再次打开小程序,又会从后台进入前台。只有当小程序进入后台一定时间,或者系统资源占用过高,才会被真正的销毁。  获取应用实例app对象:  在全局js中通过App(appConfig)设置了app全局应用,在其他页面中可以通过getApp()方法获取此对象。下面以自定义全局数据为例,通过getApp()获取对象实例,再通过对象取得自定义数据。  在index.js中获取app对象及自定义数据:  全局数据最典型的应用场景就是保存或获取用户的信息,在以后的课程中会以案例来讲解。   四、页面的生命周期 Page() 函数用来注册一个页面。接受一个 object 参数,其指定页面的初始数据、生命周期函数、事件处理函数等。属性类型描述dataObject页面的初始数据onLoadFunction生命周期函数–监听页面加载onReadyFunction生命周期函数–监听页面初次渲染完成onShowFunction生命周期函数–监听页面显示onHideFunction生命周期函数–监听页面隐藏onUnloadFunction生命周期函数–监听页面卸载onPullDownRefreashFunction页面相关事件处理函数–监听用户下拉动作其他Any开发者可以添加任意的函数或数据到 object 参数中,用 this 可以访问  Index.js代码如下:  生命周期函数· onLoad: 页面加载o 一个页面只会调用一次。o 参数可以获取wx.navigateTo和wx.redirectTo及中的 query。· onShow: 页面显示o 每次打开页面都会调用一次。· onReady: 页面初次渲染完成o 一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。o 对界面的设置如wx.setNavigationBarTitle请在onReady之后设置。· onHide: 页面隐藏o 当navigateTo或底部tab切换时调用。· onUnload: 页面卸载o 当redirectTo或navigateBack的时候调用。  页面相关事件处理函数· onPullDownRefresh: 下拉刷新o 监听用户下拉刷新事件。o 需要在config的window选项中开启enablePullDownRefresh。o 当处理完数据刷新后,wx.stopPullDownRefresh可以停止开通本田小程序电话:4006-838-530当前页面的下拉刷新。  事件处理函数  除了初始化数据和生命周期函数,Page 中还可以定义一些特殊的函数:事件处理函数。在渲染层可以在组件中加入事件绑定,当达到触发事件时,就会执行 Page 中定义的事件。微信小程序

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序的事件乐都县E企盈小程序及生命周期(3)
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

模王系统开发

联系我们升级日志

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏