微信小程序全局變量功能與用法詳解

更新時(shí)間：2019年01月22日 11:58:49 作者：Rattenking

這篇文章主要介紹了微信小程序全局變量功能與用法,結(jié)合實(shí)例形式詳細(xì)分析了微信小程序全局變量的作用、定義、使用方法及相關(guān)操作注意事項(xiàng),需要的朋友可以參考下

本文實(shí)例講述了微信小程序全局變量功能與用法。分享給大家供大家參考，具體如下：

全局變量的作用

在微信小程序開發(fā)中，會(huì)遇到一個(gè)很實(shí)際的應(yīng)用場(chǎng)景，就是一個(gè)變量會(huì)在多個(gè)頁(yè)面進(jìn)行使用。

例如：

1. 在微信小程序開發(fā)中使用高德地圖的微信小程序開發(fā)，其中key值就需要在多個(gè)頁(yè)面使用；

2. 在微信小程序開發(fā)電商平臺(tái)時(shí)同樣，比如客服電話，就需要在多個(gè)頁(yè)面使用。

在以上兩種類似的場(chǎng)景中，開發(fā)者就需要使用全局變量，當(dāng)然也有開發(fā)者說不能每個(gè)page頁(yè)面都定義一個(gè)？如果客服電話改變，如果客服要求采用他的高德key，這個(gè)時(shí)候只需要修改全局，就能進(jìn)行整個(gè)小程序的修改，如果每個(gè)page一個(gè)變量，將會(huì)在修改中花費(fèi)大量的時(shí)間做低效的工作。所以可以看出全局變量在這里的作用就是提高開發(fā)效率！

如何定義全局變量

方法一：用APP定義全局變量

在app.js中的APP({})傳入對(duì)象中定義一個(gè)全局屬性globalData，作為保存全局變量的對(duì)象。

示例代碼：

聲明變量進(jìn)行引入！

// 引入高德地圖js
const amap = require('./src/js/amap-wx.js');
// 引入接口js
const urlList = require('./src/js/config.js');
// 引入wetoast插件js
const { WeToast } = require('./src/wetoast/wetoast.js');
// 全局變量高德地圖key
const key = 'c290b7e016c85e8f279b2f80018c';
// 全局變量服務(wù)電話
const phone = '400-007-859';

進(jìn)行全局變量的賦值！

App({
 globalData: {//全局變量
  amap: amap,
  key: key,
  phone: phone,
  urlList: urlList.urlList
 }
})

方法一全局變量的使用：

//在page頁(yè)面引入app，同時(shí)聲明變量，獲得所需要的全局變量
const app = getApp();
const urlList = app.globalData.urlList;

方法二：用引入js的方法定義全局變量

在公用js文件夾中創(chuàng)建一個(gè)保存全局變量的js文件

實(shí)例：我在公用文件夾src下的js文件夾中創(chuàng)建的三個(gè)保存全局變量的文件：base64.js、config.js、data.js

這三個(gè)文件作用：

1. base64.js保存背景圖標(biāo)轉(zhuǎn)化的base64碼
2. config.js保存request請(qǐng)求數(shù)據(jù)的路徑
3. data.js 保存初次開發(fā)的模擬數(shù)據(jù)

示例代碼：

let basePath = 'https://xxxxx.com';
let urlList = {
  goodsListUrl: basePath + '/goodsList',
  shopCartUrl: basePath + '/shopCart',
  ...
}
module.exports = {
 urlList: urlList
}

使用方法：

// 引入接口js
const urlList = require('./src/js/config.js');
wx.request({
  url: urlList.urlList.goodsListUrl,
  data: {},
  success: res => {}
})

總結(jié)

其實(shí)兩種方法都可以定義全局變量，那么在什么時(shí)候采用哪一種方法？我個(gè)人建議，在像高德地圖的key值這種只需要單獨(dú)定義的，可以采用方法一，方便、簡(jiǎn)潔、不用單獨(dú)創(chuàng)建文件。在請(qǐng)求地址這種批量全局變量的定義時(shí)，采用方法二，有利于后期的查找和修改。兩種方法結(jié)合，更有利于開發(fā)！

希望本文所述對(duì)大家微信小程序開發(fā)有所幫助。

您可能感興趣的文章: