vue 建立 全局变量 全局访问

有个问题我还是想深入研究一下
就是关于 vue 中全局变量这个概念 和实现方法的探讨

不少人想都没想， 直接用vuex啊。
对啊， 我也是这个样想的 直接用vuex不就啥事没有了。

vuex支持 定义 修改。
还会实时刷新， 用来记录状态 再好不过

但是其他方式 还是有它的优势的。

方法一 （Vue.prototype）

最简单的方法， 也是最常见的

// main.js

import axios from 'axios'
// 挂载全局方法
Vue.prototype.$http = axios;
Vue.prototype.$Fun = (a = "无") => {
  console.log('$Fun执行， 参数： ' + a);
}

// 挂载全局属性
Vue.prototype.$name = "DWP";

// 任意合法页面 1
console.log(this.$name);   // DWP
console.log(this.$Fun());  // $Fun执行， 参数： 无


this.$name = "DWPNB";
// 检测 全局属性的 读
console.log(this.$name); // DWPNB  ...页面的渲染是不会跟新的
console.log(this.$Fun()); // $Fun执行， 参数： 无

// 任意合法页面 2
console.log(this.$name); // DWP  ...变量实际上并没有更改
console.log(this.$Fun()); // $Fun执行， 参数： 无

结论：

查： 无论是获取变量值， 还是执行方法 都是ok的
改： 页面的渲染是不会跟新的， 并且在其他页面变量还是原来的值

Vue.prototype.xxxx 挂载的是类似常量的东西。
建议 注意使用

方法二 （window._name）

这种方法就比较原始了

// main.js
// 挂载全局属性
window._name = "dwp";
// 挂载全局方法
window._Fun = (a = "无") => {
  return '$Fun执行， 参数： ' + a
}

// 任意合法页面 1
// 检测 全局属性的 读
console.log(_name);  // dwp
console.log(_Fun()); // $Fun执行， 参数： 无
 _name = "DWPNB";


// 任意合法页面 2
console.log(_name);  // DWPNB
console.log(_Fun()); // $Fun执行， 参数： 无

结论：

查： 无论是获取变量值， 还是执行方法 都是ok的
改： 只要是被修改了， 在这个项目中无论那个位置获取这个值， 都是被修改的值

window._xxxx 就是相等于， 定义了一个变量，

但是这个变量无法直接渲染到项目， 同时也过于灵活。
不建议这样使用

方法三 (vuex) 推荐

这是关于vuex的简绍使用
https://blog.youkuaiyun.com/dwp_wz/article/details/107976732
vuex就不过多介绍了， 会的人 自然会 不会的 看完我写的 也会用了