一.什么是getters?vuex中的getters用于对state中存储的数据进行过滤操作。比如等级:假设1代表初级,2代表中级,3代表高级。在state中存储level值为1或2或3.想在页面中获取对应等级就需要进行转换。此时就需要用到ge...
                
一.什么是getters?
vuex中的getters用于对state中存储的数据进行过滤操作。
比如等级:假设1代表初级,2代表中级,3代表高级。在state中存储level值为1或2或3.想在页面中获取对应等级就需要进行转换。此时就需要用到getters。
二.使用getters
1.在store文件夹下创建getters.js文件,并在index下引入

 
2.在state.js增加userStatus

 其中userStatus代表等级,0为普通会员,1为vip会员,2为高级会员
3.getters代码如下,对userStatus进行转换
const getters ={
    memberInfo(state){
        switch (state.userStatus) {
            case 0:
                return "普通会员"
                break;
            case 1:
                return "vip会员"
                break;
            case 2:
                return "高级会员"
                break;
            default:
                break;
        }
    }
}
export default getters;
此时控制台会展示

4.界面中获取userLevel的值
<h1>{{ $store.getters.memberInfo }}</h1>
vuex中提供了更简单的获取方法:

				 沃梦达教程
				
			本文标题为:vuex Getters基本用法
				
        
 
            
        基础教程推荐
             猜你喜欢
        
	     - Ajax实现动态加载数据 2023-02-01
 - 浅谈Vue2和Vue3的数据响应 2023-10-08
 - vue离线环境如何安装脚手架vue-cli 2025-01-19
 - JS前端广告拦截实现原理解析 2024-04-22
 - 关于文字内容过长,导致文本内容超出html 标签宽度的解决方法之自动换行 2023-10-28
 - 浅析canvas元素的html尺寸和css尺寸对元素视觉的影响 2024-04-26
 - js禁止页面刷新与后退的方法 2024-01-08
 - 基于Vue制作组织架构树组件 2024-04-08
 - CSS3的几个标签速记(推荐) 2024-04-07
 - this[] 指的是什么内容 讨论 2023-11-30
 
    	
    	
    	
    	
    	
    	
    	
    	
						
						
						
						
						
				
				
				
				