Vue.js教程-Vuex

本文介绍了Vuex作为Vue应用状态管理器的重要性,如何通过state管理共享数据,actions与mutations的操作规则,以及在多界面开发中的应用场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Vuex是什么

  • 首先它是状态管理器,管理了多个组件都要用的共享变量,将这些变量封装到一个对象中,然后把这个对象放在Vue的实例里,就是new Vue({})里,大家应该没忘。
  • 那为什么要Vuex来管理呢,自己封装一个对象然后放进Vue实例中不也可以吗?其实Vuex最重要的特点就是响应式,因为自己实现响应式太麻烦了,所以就开发了Vuex。

Vuex怎么管理状态

  • 管理的就是共享的信息,例如你的登录信息,总不能切换个界面就得重新登录一次吧。
  • 所有的共享信息都放在state中,并进行响应式操作。
    在这里插入图片描述
  • 毫无疑问,其实就是actions对state进行操作,然后展现给view,view中可以通过点击等事件调用actions。
  • 这里最重要的就是state,它就是我们的状态。
    在这里插入图片描述
  • Vuex其实是用于多界面的开发,就像电商系统,你点击了你的购物车,界面跳到购物车页面并显示你这个登录账号的购物车,这个需求就是共享了登录信息,那么这个登录信息就是保存在Vuex中。
  • Vuex就等于一个管家,管理着所有的共享变量,所有对state的操作都需要通过Vuex中的actions和mutations规定的规则进行修改。
    在这里插入图片描述
  • 最后就是将需要用的状态量和全局函数写在对应的位置上就行了。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值