说明：.vue 和 .nvue 并不是一个规范，因此一些在 .vue 中适用的方案并不适用于 .nvue。

1. 自定义公用模块

定义一个专用的模块，用来组织和管理这些全局的变量，在需要的页面引入。
优缺点：这种方式维护起来比较方便，但是缺点就是每次都需要引入。
注意：这种方式只支持多个vue页面或多个nvue页面之间公用，vue和nvue之间不公用。如果希望 .vue 和 .nvue 复用一些方法的话，需要采用公用模块的方案，分别在 .vue 和 .nvue 文件中引入。

示例如下：

• 定义公用模块：在 uni-app 项目根目录下创建 common 目录，然后在 common 目录下新建 helper.js 用于定义公用的属性或方法。

const apiUrl = "http://www.hcoder.net";
const now = Date.now || function () {  
    return new Date().getTime();  
};  
const isArray = Array.isArray || function (obj) {  
    return obj instanceof Array;  
};  
const sayHi = function(){
 console.log('hi');
}

export default {  
    apiUrl,  
    now,  
    isArray,  
    sayHi   
}

• 在test.vue 中引用该模块

<template>
    <view>
        当前时间戳:{{time}}
    </view>
</template>

<script>
import helper from "../../../common/helper.js"
export default {
    data() {
        return {
            time:""
        }
    },
    methods: {
        
    },
    onLoad:function(){
        helper.sayHi();
        console.log("now:" + helper.now());
        this.time = helper.now();
    }
}
</script>

<style>

</style>

2. 挂载 Vue.prototype

将一些使用频率较高的常量或者方法，直接扩展到 Vue.prototype 上，每个 Vue 对象都会“继承”下来。
优点：只需要在 main.js 中定义好即可在每个页面中直接调用。
注意：Vue 上挂载属性的方式只支持vue页面，不能在 nvue页面中使用。

示例如下：

• 在 main.js 中挂载属性/方法

Vue.prototype.apiUrl = 'http://uniapp.dcloud.io';  
Vue.prototype.now = Date.now || function () {  
    return new Date().getTime();  
};  
Vue.prototype.isArray = Array.isArray || function (obj) {  
    return obj instanceof Array;  
};
Vue.prototype.dosomething = function(){
 console.log('do....');
}

• 在test.vue 中调用

<template>
    <view>
        当前时间戳:{{time}}
    </view>
</template>

<script>
export default {
    data() {
        return {
            time:""
        }
    },
    methods: {
        
    },
    onLoad:function(){
        this.dosomething();
        console.log("now:" + this.now());
        this.time = this.now();
    }
}
</script>

<style>

</style>

建议：

• 每个页面中不要再出现和全局变量（或方法）相同的属性名（或方法名）。
• 在 Vue.prototype 上挂载的属性或方法，可以加一个统一的前缀。比如 $url、global_url 这样，在阅读代码时也容易与当前页面的内容区分开。

3. globalData

小程序有globalData机制，这套机制在uni-app里也可以使用，全端通用。
在App.vue文件里定义globalData（也可以使用 API 读写这个值），然后可在globalData中定义全局变量。
优点：globalData 是一种比较简单的全局变量使用方式。globalData 支持 vue 和 nvue 共享数据。

示例如下：

• 在 App.vue 中声明全局变量

<script>  
    export default {  
        globalData: {  
            name: 'liy'  
        },  
        onLaunch: function() {  
            console.log('App Launch')  
        },  
        onShow: function() {  
            console.log('App Show')  
        },  
        onHide: function() {  
            console.log('App Hide')  
        }  
    }  
</script>  

<style>  
    /*每个页面公共css */  
</style>  

• 为全局变量赋值

getApp().globalData.name= 'yang'//赋值

• 获取全局变量的值

console.log(getApp().globalData.name) //取值

如果需要把 globalData 的数据绑定到页面上，可在页面的onShow声明周期里进行变量重赋值。
实战拓展：页面通讯 - 使用url传参或使用全局变量共享数据。

4. Vuex

vue是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。

示例如下：
(1) 在根目录下创建 stroe/index.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex);
const store = new Vuex.Store({
 state : {
  nickname : "未设置"
 },
 mutations : {
  change : function(state, nickname){
   state.nickname = nickname;
  }
 }
});
export default store

(2) 在main.js中挂在Vuex

import store from './store'
Vue.prototype.$store = store;

(3) 在test.vue 中调用

• test.vue

<template>
 <view class="content">
  <text class="title">--{{nickname}}--</text>
  <button type="primary" @tap="openchange">改名</button>
 </view>
</template>
<script>
 import {
  mapState,
  mapMutations
 } from 'vuex';
 export default {
  data() {
   return {
   }
  },
  computed:{
   ...mapState(['nickname'])
  },
  methods:{
   openchange : function(){
    uni.navigateTo({
     url: '../change/change',
    });
   }
  }
 }
</script>

• change.vue

<template>
 <view>
  <button type="primary" @tap="change">change</button>
 </view>
</template>
<script>
 import {
  mapState,
  mapMutations
 } from 'vuex';
 export default {
  methods:{
   change : function(){
    this.$store.commit('change', 'hi...')
   }
  }
 }
</script>

说明：使用 Vuex 保证了变量在全局的统一性，可以在实际开发中进行对应场景的应用。