美文网首页
vuex可以存储哪些信息

vuex可以存储哪些信息

作者: 微点 | 来源:发表于2025-03-28 09:19 被阅读0次

  首先,vuex中存储的是公用信息,而具有公用属性的一般为页面通用信息,比如菜单信息,悬浮信息,页脚,网站标题与描述等,这些信息在整个网站中网页占比很大,很多页面都会使用到,为了存取方便,可以放入vuex中,一次存储,到处使用的目的。

  vuex主要为存储公用数据,并能追踪数据诞生的,也就是调试场景,它的出现能让程序员更好的控制通用数据,跨组件调用数据,随时知道组件中数据变化情况,方便预期检测,与代码调试,很好的达到隔离性与统一管理的目的,减少使用复杂度与数据不可控,增加业务耦合度的目的。

  vuex中,mutations主要起到数据变更与追踪的目的,它里面定义的方法变更数据时都会被记录,从而达到时时监控的目的,为了减轻监控负担,而减少监控复杂度,异步请求都会放在actions中,mutations只做state数据状态变更,也就是监听数据变化,其它不管,而计算数据,与computed相似的功能为getter对象,在里面定义的方法都能存入缓存,有变化即自动变更,跨组件引用目的。

  为啥data定义数据时,是函数,而不是方法,而methods却是对象,而不是函数?

  首先,data中定义的是数据,数据在组件中,组件可以被无限复用,每次复用都会初始化组件,并初始化data,若为对象,则不会开辟新内存,同一个地址内存,后面内存数据在某个组件中变化了,其它相同组件都会跟着变化,这样数据污染,出bug了,安全性得不到保障,所以需要隔离,每次export时,data部分只生成单独的副本,以达到数据隔离,不用原来的地址。

methods为逻辑片段,没有数据变化问题,无需考虑数据污染问题,再者若定义为函数,里面在定义函数,里面函数在使用this无法知道this是谁,它指向调用方,而调用方指向调用的外层函数methods,若想使用,则需要额外在methods,中定义,再在内部的方法中使用,增加额外负担不说,还容易出错,当然,使用箭头函数可以自动绑定最顶层this,但不够灵活,被限制了。

comput,created钩子函数等为啥要设计为对象,因为有set,get,com,额外属性要考虑,见下回分解。

相关文章

网友评论

      本文标题:vuex可以存储哪些信息

      本文链接:https://www.haomeiwen.com/subject/vmtevjtx.html