mpvue 全局變量的實現


一、

1. 初始化創建完成項目之后,找到 src 目錄下的 main.js

例:

2. 在 main.js 最后將小程序的全局變量添加到 Vue 的原型上

例: 

此例小程序的全局方法 getApp() 添加一個全局變量 globalData 賦值給 Vue 原型 Vue.prototype 添加的 globalData

添加數據:

此 main.js 頁面添加:

直接給 Vue 原型 Vue.prototype 賦值即可

在不同頁面添加:

可以在生命周期中使用 this 添加

例:

在不同頁面使用:

例:

重要:在使用時獲取不到值的話,可能是以下第二種方法最后提及的注意事項的原因

 二、

使用 Vue 項目中定義全局變量的方式

1. 單獨添加一個全局變量的模塊(可以在任何地方)

在 components 組件文件夾中添加一個全局模塊 global.vue

例:

2. 文件夾中添加 script,定義變量或直接導出,導出使用 export default

例:

3. 在需要的頁面導入使用(兩種使用方法)

。在 pages 中 .vue 頁面文件使用

頁面(.vue)中添加 script 使用 import from 導入

例:

可以在初始化(data)或生命周期中直接使用

例:

。。在 pages 中 .js 文件導入,在 .vue 頁面使用

例: 

使用的還是掛載在 Vue 實例上,還是要注意賦值要在最后

在 .vue 頁面中使用

注意:因為是在 pages 頁面中的 js 文件引入,此時數據只是掛載在實例上,實例中是有值,

但是在剛進入頁面時只能獲取到 undefined,

所以初始化中和 created 是拿不到值的,只能在 mounted 之后在賦值

例: 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM