vue2的全局变量


如果不用vuex处理全局状态的话,看到网上有介绍额外创建一个空的vue实例(记得是官网这么说的,懒得查证了),或者以js的方式实现。
比如仅仅是存储几个状态,vuex有些浪费。

创建一个文件,比如bus,内容如下

<script>
let userid = '-1'
let password = ''
let logined = false
export default {
userid,
password,
logined
}
</script>

总结:默认变量的值需要如上提前设置,在export里面设置,没有效果。另外,如果不需要默认值,不需要在文件中声明。
如果入口文件为main.js,在该文件中如下(这里我是用vux做的项目)
import Vue from 'vue'
import FastClick from 'fastclick'
import VueRouter from 'vue-router'
import {AjaxPlugin, LoadingPlugin} from 'vux'
import App from './App'
import bus from './bus'
Vue.use(VueRouter)
Vue.use(AjaxPlugin)
Vue.use(LoadingPlugin)
Vue.prototype.bus = bus
const routes = [
{path: '/', redirect: '/home'},
......
]
const router = new VueRouter({
routes
})
FastClick.attach(document.body)
Vue.config.productionTip = false
/* eslint-disable no-new */
new Vue({
router,
render: h => h(App)
}).$mount('#app-box')

在vue文件中可以直接使用bus存放变量。再说一遍,如果不需要默认值,不需要在bus文件中声明。
在其他vue文件里可以直接使用bus中的变量
<template>
  ......
</template>
<script>
import { XHeader, Sticky, Group, Datetime, PopupPicker, XInput } from 'vux'
export default {
......
created () {
if (this.bus.logined === false) {
this.$router.push('login')
return
}
this.getAccountData()
this.getBaseData()
}
}
</script>
<style scoped>
</style>



免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM