微信小程序全局状态是什么

　　介绍

这篇文章主要讲解了“微信小程序全局状态是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“微信小程序全局状态是什么”吧!

前言

在微信小程序中,可以利用App.js的globalData作为中间桥梁,在页面中,组件之间,包括页面与页面,页面与组件,组件与组件之间传递需要传递的信息。但是,我们不能及时的知道globalData下的变化,在新建小程序的官方的默认事例中,获取用户信息这一网络操作有延迟的,为此写了很多不必要的代码。就连官方案例都存在这一情况,相信在开发中你也会遇到类似的情况。在本文中将介绍如何解决这一类问题。

需求分析

相信以下情况是我们在没有全局状态管理下常有的操作:

<李>

在页面中,组件的> <李>

在页面,组件初始加载时,尽早的从globalData获取并赋值到页面,组件所需要的一些属性

<李>

及时的获取一些globalData某一属性的变化,并进行一些后续相关操作

<李>

在改变页面组件的值的同时,其他页面,组件也进行一样的改变

下面是需求的原始代码

//, App.js 　　应用程序({ 　　,globalData: { 　　用户信息才能:零 　　}, 　　,onLaunch () { 　　wx.getSetting({才能 　　,,,成功:res =祝辞,{ 　　,,,如果(res.authSetting [& # 39; scope.userInfo& # 39;)) { 　　,,,,wx.getUserInfo ({ 　　,,,,,成功:,res =祝辞,{ 　　,,,,,,this.globalData.userInfo =res.userInfo 　　,,,,,,//,需求2 　　,,,,,,if  (this.userInfoReadyCallback), { 　　,,,,,,,//,存在此回调函数,意味着,page 执行了,onLoad 　　,,,,,,,//,且没有获取到,userInfo 并赋值到,page 的,data 中 　　,,,,,,,//,执行此回调函数,赋值到相应的页面中 　　,,,,,,,this.userInfoReadyCallback (res) 　　,,,,,,} 　　,,,,,} 　　,,,,}) 　　,,,} 　　,,} 　　})才能 　　,} 　　}) //,/索引/index.js页面 　　const  app =, getApp () 　　页面({ 　　,//? 　　,onLoad(选项){//才能,需求1 　　const 才能;userInfo =app.globalData.userInfo 　　userInfo 才能,,,,this.setData ({useInfo})//才能,需求2//才能,如果没有获取到,app.globalData.userInfo//才能,意味还未执行,wx.getUserInfo 的回调函数//,才能给,app 添加响应的一个回调函数,绑定此时的,却,能够到回调函数 　　userInfo 才能| |,app.userInfoReadyCallback =, res =祝辞,{ 　　,,this.setData ({ 　　,,,用户信息:res.userInfo 　　,,}) 　　,,delete  app.userInfoReadyCallback 　　,,} 　　,} 　　})

微信小程序全局状态是什么

这是官方小程序案例的代码,我只做了一点修改,这里只是展示了需求2,globalData属性从无到有时执行页面设置的回调函数,并没有实现每一次都会执行回调函数,需求3的代码比较复杂,不在此展示。

我们可以思考,以上几点需求需要实现的,一定要有的代码有哪些。可以发现,需求1和需求3主要就是页面,组件初始化,和globalData属性被改变时都需要使用。setData方法,只不过每次这样的指向的实例不同。而需求2则是应该存在一个回调函数,且回调函数的这也应该指向相应的实例,在globalData属性被改变时执行这些回调函数。
从时间点来看,我们有两个,一个是页面,组件初始化,一个是globalData属性改变时,那么第一个时间点,我们可以考虑到小程序的生命周期的钩子函数,onLoad和连接,在这两个时间点执行。setData的操作。而globalData属性的改变都是我们主动或者用户事件而产生的,就是可以看作这一操作是一个对globalData某个属性的事件,而这个事件发生后再去执行一些写好的回调函数。

从操作对象来看,基本都是页面和组件的实例,以及app.globalData。

需求理论性总结

综上,我们可以在初始化时,进行自动的。setData(不用自己手动),和保存这(用于事件执行时指向相应的实例),存储相应的回调函数为事件(事件就是未执行的函数),在需要时主动触发这个事件即可。那么可以看的到,整个流程下来,我们需要一个横跨应用程序,网页,组件之间的一个变量,用于劫持初始化的钩子函数,进行自动化赋值,存储相应的事件,暴露一个事件触发的接口。

纸上得来终觉浅,绝知此事要躬行

看到这里,相信你已经有一定的了解全局状态管理,那么到底如何实现呢?在这里,我要强调,如果你阅读此文后对此有一定的了解了,我说的思路,那么你一定要自己尝试实现出代码,不管是否好坏,总是比没有实现的好,在自己实现中也许有更多的收获。下面以上上面案例展示一下简单的实现代码,给没看太明白的一个思路。在下次我会写一遍相关代码实现的讲解,应该会有。

微信小程序全局状态是什么