taro 全局变量四种方法

环境

• taro 2.2.3
• window
• 微信小程序

使用getApp()方法

在taro中，使用Taro.getApp(),能获取到App的实例，可以通过这种办法，把全局变量写入App实例中。要在构造函数中创建，或者在函数外定义，如果在componentDidMount()函数中定义无效。

// app.jsx   定义
class App extends Component {
  constructor() {
    super();
    // 构造函数内定义一个a
    this.a = "is a";
  }
    // 函数外定义一个b
    b="is b";
      ...
}
//  index.jsx 获取
const app = Taro.getApp();
console.log(app.a)      // is a
console.log(app.b)      // is b

使用config下的env

配置完，如果是开监听模式，请关闭监听，重新监听并编译，否则无效

在config目录下编辑。在文件中dev.js，配置env。在这里，官方给出的NODE_ENV值为 '"development"'，使用单引号，再使用双引号。但是自己在如上所述的环境下，直接使用单引号或者双引号可以直接访问。

// dev.js 定义
...
env: {
    NODE_ENV: '"development"',
    AAA: "is AAA"        // 定义一个AAA
  },
...
// index.jxs 获取使用
...
console.log(process.env.AAA)    // is AAA
...

在config文件下的三个文件中均能配置env，下面的 defineConstants 也一样。

使用config下的defineConstants

这个配置下的定义可以直接使用，所以一定要避免重复定义变量，要起作用，也要重启编译。

// dev.js 定义
defineConstants:{
        HOST: "https://demo.cn/"
}
// index.jsx 获取并使用
...
// 直接使用变量名
console.log(HOST)   // https://demo.cn/
...

使用引入的方式import Golbal from path/golbal

这种方法就是基础常规的方法，网上有很多关于此类的写法及其作用。

1. 为了好管理，将全局变量写在一个文件中，统一管理。即在 src 目录下创建一个任意名字文件夹，例如 config 文件夹
2. 在 config 文件夹下创建一个任意的名字的文件，例如golbal.jsx
3. 将数据变量 exports 出来。
4. 使用的时候，使用 import 就可以了