微信小程序中全局共享数据globalData的使用

1.全局共享数据

全局共享数据的两种方式

• 通过Vue原型共享数据
• 通过globalData共享数据
• vuex
• 本地存储

1)在Vue实例原型属性上添加属性,其他任何页面预想使用,直接使用this获取到,
比如:
主要代码:(在入口文件mian.js中)

import request from './utils/request'
Vue.prototype.request=request;

2)通过globalData的方式
说明:小程序有globalData,这是一个简单的全局变量机制.这套机制在uni-app中也可以使用,并且全端使用


官网介绍:https://uniapp.dcloud.io/collocation/App?id=globaldata

说明:
在应用vue中定义globalData的相关配置:

<script>  
    export default {  
        globalData: {  
            text: 'text'  
        }
    }  
</script>

在js中操作globalData的方式如下:

getApp().globalData.text='test'

注意:

• 在应用App.vueonLaunch时,getApp对象还未获取,暂时可以使用this.$scope.globalData获取globalData
• 如果需要把globalData的数据绑定在页面上,可在页面的onShow页面生命周期里进行变量赋值

举例1:

• 首先,我在应用App.vue中定义了一个全局变量dataTest,并赋值为dataText

• 然后我在album页面的生命周期函数onShow中对其进行更改即重新赋值为changeText,然后再mine页面中进行输出
  
• 结果如下输出changeText
  

注意:

想要在mine页面获取到album页面更改的全局数据,也是先创建了album页面,才能触发这个全局数据的值更新
如果你没有点击到album页面(此时album页面组件并没有被创建,所以全局数据是没有发生变化的,那么在mine页面输出的仍是在应用App.vue中定义的初始值为dataText

举例2: