vue创建全局变量

需求：vue项目需要将登录信息保存为全局变量

window.localStorage

最开始是使用window.localstorage来进行存取登录信息，方法如下

封装了一个专门使用window.localStorage的js，需要时引入这个filter.js就行

const setLocalStore = (name, content) => {
    if (!name) return
    if (typeof content !== 'string') {  
      //window.localStorage只能存储字符串
      content = JSON.stringify(content)
    }
    window.localStorage.setItem(name, content)
  }
  
  const getLocalStore = name => {
    let result;
    if(!name) {
      result = '';
    }else{
      result = window.localStorage.getItem(name);
    }
    return result;
  }
  
  const removeLocalStore = name => {
    if (!name) return
    window.localStorage.removeItem(name)
  }
  
  const clearLocalStore = () => {
    window.localStorage.clear();
  }
  
  export default { 
    setLocalStore,
    getLocalStore,
    removeLocalStore,
    clearLocalStore
  };

//使用
import filter from '../../common/util/filter';
this.partnerId = filter.getLocalStore('partnerId') || '';
filter.setLocalStore('userName', busiDataResp.userName);

但由于将用户信息存储在localStorage中不安全，这里修改为存储为全局变量的方式

简易版可读写的全局变量

plaintext

//在main.js中定义，通过this.$root存取
new Vue({
	data: function(){
    return {
      userName: ''
    }
	},
	render: h=>h(App)
}).mount('#app');


//模板页面存取
this.$root.userName = "zhsi";
let userName = this.$root.userName;