vue 建立 全局变量 全局访问
有个问题我还是想深入研究一下就是关于 vue 中全局变量这个概念 和实现方法的探讨不少人想都没想, 直接用vuex啊。对啊, 我也是这个样想的 直接用vuex不就啥事没有了。vuex支持 定义 修改。还会实时刷新, 用来记录状态 再好不过但是其他方式 还是有它的优势的。方法一 (Vue.prototype)最简单的方法, 也是最常见的// main.jsimport axios from 'axi
·
有个问题我还是想深入研究一下
就是关于 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.csdn.net/dwp_wz/article/details/107976732
vuex就不过多介绍了, 会的人 自然会 不会的 看完我写的 也会用了
更多推荐
已为社区贡献17条内容
所有评论(0)