zoukankan      html  css  js  c++  java
  • 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>


  • 相关阅读:
    C++二叉树
    C++、、
    C++符号优先级
    django 时间格式(全局修改,不用过滤器)
    华硕ASUS U5800GE驱动
    pycharm 代码跟进以跳回/返回
    linux多jdk切换环境
    celery timeout的拦截
    chrome开启headless模式以及代理
    python 单引号与双引号的转义
  • 原文地址:https://www.cnblogs.com/htsky/p/7930618.html
Copyright © 2011-2022 走看看