注:本文仅对这几种方式进行简短的阐述,作为记录。
我们在写代码时免不了要对一些变量进行一些存储,但有时这些变量或常量使用到的频率又非常高,不论从优化代码解决冗余还是少给自己添不必要的麻烦看,把这些重复的变量进行统一存储和管理是必要的。
1.公用模块
定义一个专用的模块,如在项目里common目录下建立一个heip.js的文件用来定义方法,然后在其他界面引入该模块或去该公用方法(可对不同的方法选择性进行引入)。
如:import {getToken} from "./global";
2.挂载Vue.prootype
将一些使用频率高的常量或方法,直接拓展到Vue.prototype上,每个Vue对象都会继承下来。然后在main.js中挂载。
import {jumpTo,isWx} from './units/global';
Vue.prototype.jumpTo = jumpTo
Vue.prototype.isWx = isWx
这样的话就可以在其他界面直接调用就可以使用了。
3.globalData
小程序里的globalData概念,在APP上全局声明变量一次,会继承到全局所有界面。
如:赋值:getApp().globalData.text = 'test';取值:console.log(getApp().globalData.text) // 'test'。
4.Vuex
vuex作为专为vue.js应用程序开发的状态管理模式,它采用集中存储管理应用的所有组件的状态。
实际使用:
在根目录下新建store目录,在store目录下创建index.js定义状态值,然后在main.js挂载Vuex。
main.js:
imoprt store from ‘./store’
new Vue({
el: '#app',
router,
store,
components: { App },
template: ' '
})
一次奥迪