vuex——计算属性获取的getter值需要刷新才能更新

news/2024/7/10 1:56:17 标签: vue, 数据仓库

vuexgetter_0">vuex——计算属性获取的getter值需要刷新才能更新

描述:

 // state
 state: {
    leader: null
 },
 // getters
 getters: {
    getLead: state => state.leader
 }
 // mutations
 mutations: {
    setLead (state, data) {
      state.leader = data
    }
 },
// 页面中赋值
// 登录时改变state.leader的值
this.$store.commit('setLead', true)
// 组件中计算属性监听
import { mapGetters } from 'vuex'
computed: {
   leader () {
     ...mapGetters(['getLead'])
   }
 }

打印this.leader,直接获取计算属性值

在这里插入图片描述

刷新之后的打印结果

在这里插入图片描述

解决

增加监听函数watch,修改计算属性

computed: {
     ...mapGetters(['getLead'])
     //原来
   		//leader () {
    	// ...mapGetters(['getLead'])
   		//}
 }
watch: {
    // 监听getters数据 --- 'getLead'
    // 解决state数据可以更新,但getters数据需要刷新才能更新的问题
    getLead (val) {
      this.leader = val
      // this.leader是data中自定义的值,
      // 赋值之后,一定要重写之后的方法,
      // 不然只是取值,页面操作依然不会改变
      this.showVip() // 这是我页面上的方法名
    }
  },

http://www.niftyadmin.cn/n/1659999.html

相关文章

cmd命令窗口无法使用快捷键处理方法

cmd命令窗口输入CtrlC显示^V的处理方法, 不要使用快捷键CtrlC,CtrlV 直接用右键标记,右键粘贴转载于:https://www.cnblogs.com/wodexiaobiji/p/10848945.html

【Java|golang】2679. 矩阵中的和

给你一个下标从 0 开始的二维整数数组 nums 。一开始你的分数为 0 。你需要执行以下操作直到矩阵变为空: 矩阵中每一行选取最大的一个数,并删除它。如果一行中有多个最大的数,选择任意一个并删除。 在步骤 1 删除的所有数字中找到最大的一个…

vue——base64图片转网络URL

vue——base64图片转网络URL src支持base64图片,正常base64图片可以直接复制到图片src,也可以将其转为URL // data url: XXXXXXXX // base64编码 imgUrl: // 图片路径// methods base64ImgtoFile (dataurl, filename file) {const arr dataurl.spli…

反爬机制

robots 防君子不防小人 UA伪装 request 设置headers参数 ajax 动态数据json 图片懒加载 src2/origin 数据加密 js代码里面一些function 加密算法 验证码 云打码/超级鹰12306 cookie session会话 哈希值 xpath element 里面搜索 # …

Vue——按钮防抖

Vue——按钮防抖 按钮多次点击,只执行点击动作完成的一次事件触发 1.创建utils/once.js文件 export const Debounce (fn, t) > {const delay t || 500let timeoutreturn function () {const context thisconst args argumentsif (!timeout) {timeout set…

链改也是一种供给侧改革 企业上链你准备好了吗?

随着区块链、移动互联网、云计算、人工智能等高新技术的发展,众多传统企业尤其是传统制造业如若不能摆脱低端产业链,就随时会被时代所淘汰。从2015年开始的供给侧改革到今天的链改,传统企业也在经历巨变。 链改就是对传统股份制企业进行区块链…

兼容ie——下载base64pdf格式文件

1.URL转blob dataURLtoBlob (dataurl) {const bstr atob(dataurl)let n bstr.lengthconst u8arr new Uint8Array(n)while (n--) {u8arr[n] bstr.charCodeAt(n)}return new Blob([u8arr], { type: pdf }) // pdf下载// return new Blob([u8arr], { type: application/vnd.m…

[Usaco2008 Nov]Buying Hay 购买干草

题目描述 约翰的干草库存已经告罄,他打算为奶牛们采购H(1≤H≤50000)磅干草,他知道N(1≤N≤100)个干草公司,现在用1到N给它们编号。第i个公司卖的干草包重量为Pi(1≤Pi≤5000)磅,需要的开销为Ci(l≤Ci≤5000)美元.每个干草公司的货源都十分充足,可以卖出无限多的干草…