VUE中全局变量的定义和使用
程序员文章站
2022-06-29 07:57:22
[toc] VUE中全局变量的定义和使用 1.工作中遇到的两类问题 1.1 状态值(标志) A界面赋值的a变量,作为记录状态值(标志)需要被其他几个界面使用。其他几个界面亦可以改变a状态值。 1.2 传递字段 A界面有a字段,B界面没有a字段,但需要调用a字段。 2.解决方法 2.1 VUEX 使用 ......
目录
vue中全局变量的定义和使用
1.工作中遇到的两类问题
1.1 状态值(标志)
a界面赋值的a变量,作为记录状态值(标志)需要被其他几个界面使用。其他几个界面亦可以改变a状态值。
1.2 传递字段
a界面有a字段,b界面没有a字段,但需要调用a字段。
2.解决方法
2.1 vuex
使用vuex管理状态与字段值,但有种杀鸡用牛刀的感觉,稍微显重了一点。
2.2 使用全局变量法管理状态与字段值
轻量,简单。
故本文使用全局变量法解决1中提出的两个问题
3.具体实现
3.1创建全局文件
在工具文件夹,创建glabal_val.js
3.2创建全局变量和设置全局变量的方法如下
export default{ sso_flag:"0", set_sso_lag(sso_flag){ this.sso_flag = sso_flag; } }
3.3导入数据(全局变量)
import global from '@/utils/global_val'
3.4在 a界面设置全局变量的状态位
global.set_sso_flag(1)
也可global.set_sso_flag=this.sso_flag直接进行赋值
3.5在b界面判断
在b界面dom 标签里结合vue的v-if,v-else-if指令进行逻辑判断
<div v-if="global.sso_flag==0"> </div> <div v-else-if="global.sso_flag==1"> </div>
上一篇: 【nodejs原理&源码赏析(5)】net模块与通讯的实现
下一篇: 玩抖音看这篇就够了
推荐阅读
-
详解在iOS App中自定义和隐藏状态栏的方法
-
iOS App中UILabel的自定义及在Auto Layout中的使用
-
tensorflow中tf.slice和tf.gather切片函数的使用
-
详解C#中的System.Timers.Timer定时器的使用和定时自动清理内存应用
-
Python中在for循环中嵌套使用if和else语句的技巧
-
Python中for循环和while循环的基本使用方法
-
CorelDRAW中手绘工具的使用方法和操作技巧介绍
-
Vue.js 中的 v-cloak 指令及使用详解
-
vue template中slot-scope/scope的使用方法
-
浅谈Vue.js 中的 v-on 事件指令的使用