当前位置: 首页 > news >正文

vue2中vuex的各项的各种调用方式,部分对比vue3的pinia

首先vuex的实例化比较特别,通过

导入Vue和Vuex,先Vue.use(Vuex)再

new Vuex.store()的方式来实例化仓库

模块则是通过创建modules文件夹,在新建的文件中export符合规范的对象,这样约定俗成的方式来创建,然后一些限制就是模块需要加上namespaced:true这个属性,大仓库则是通过new Vuex({

modules:{

        导入的模块名//注意,这里modules接收的是对象

}

})

这样的方式来关联大仓库和模块。

pinia则是通过 

import createPinia来实例化仓库。然后通过

defineStore来实例化小仓库,即小模块仓库。

再然后就是两者都会放到main.js/ts中进行调用,来使其生效。

然后就是vuex中的调用方式了

store.state.模块名.state

store.getters['模块名/getters']

上面这两个都是属性,所以不需要加()去调用,后面的才需要()调用,然后调用方式是一样的

store.commit('模块名/mutation',参数)

store.dispatch('模块名/action',参数)

再就是放到computed和methods里面的...map的形式。

如...mapState('模块名',[‘state属性1’,...])

computed{

        ...mapState('模块名',['state属性1','state属性2']),

        ...mapGetters('模块名',['getters属性1','getters属性2'])

}

methods{

        ...mapMutations('模块名',['mutations方法1','mutations方法2']),

        ...mapActions('模块名',['actions方法名1','actions方法名2'])

}

相关文章:

  • 【Redis,Java】Redis的两种序列化方式—nosql数据库
  • leetcode 01背包问题
  • Recorder 实现语音录制并上传到后端(兼容PC和移动端)
  • unity学习(15)——服务器组装(1)
  • LeetCode 0590. N 叉树的后序遍历:深度优先搜索(DFS)
  • 课后延时服务选课报名管理系统功能清单
  • RESTful 风格是指什么
  • 1027. 最长等差数列【leetcode】/动态规划
  • 【嵌入式】CAN总线
  • 数据库管理-第151期 Oracle Vector DB AI-03(20240218)
  • 【算法】树状数组
  • 突破编程_C++_面试(变量与常量)
  • WireShark 安装指南:详细安装步骤和使用技巧
  • 算法练习-01背包问题【含递推公式推导】(思路+流程图+代码)
  • 沁恒CH32V30X学习笔记11---使用外部时钟模式2采集脉冲计数
  • 08.Android之View事件问题
  • css布局,左右固定中间自适应实现
  • js学习笔记
  • Service Worker
  • vue2.0开发聊天程序(四) 完整体验一次Vue开发(下)
  • Vue组件定义
  • Webpack4 学习笔记 - 01:webpack的安装和简单配置
  • WordPress 获取当前文章下的所有附件/获取指定ID文章的附件(图片、文件、视频)...
  • 阿里云爬虫风险管理产品商业化,为云端流量保驾护航
  • 快速构建spring-cloud+sleuth+rabbit+ zipkin+es+kibana+grafana日志跟踪平台
  • 你不可错过的前端面试题(一)
  • 前端面试之CSS3新特性
  • 如何将自己的网站分享到QQ空间,微信,微博等等
  • 使用docker-compose进行多节点部署
  • 数组的操作
  • 通过npm或yarn自动生成vue组件
  • 网络应用优化——时延与带宽
  • 写给高年级小学生看的《Bash 指南》
  • 新版博客前端前瞻
  • 职业生涯 一个六年开发经验的女程序员的心声。
  • Android开发者必备:推荐一款助力开发的开源APP
  • MyCAT水平分库
  • Redis4.x新特性 -- 萌萌的MEMORY DOCTOR
  • ### Cause: com.mysql.jdbc.exceptions.jdbc4.MySQLTr
  • #【QT 5 调试软件后,发布相关:软件生成exe文件 + 文件打包】
  • #define、const、typedef的差别
  • #NOIP 2014#Day.2 T3 解方程
  • $().each和$.each的区别
  • $con= MySQL有关填空题_2015年计算机二级考试《MySQL》提高练习题(10)
  • (AtCoder Beginner Contest 340) -- F - S = 1 -- 题解
  • (C语言)球球大作战
  • (delphi11最新学习资料) Object Pascal 学习笔记---第7章第3节(封装和窗体)
  • (每日持续更新)信息系统项目管理(第四版)(高级项目管理)考试重点整理第3章 信息系统治理(一)
  • (全部习题答案)研究生英语读写教程基础级教师用书PDF|| 研究生英语读写教程提高级教师用书PDF
  • (转)Scala的“=”符号简介
  • (转载)OpenStack Hacker养成指南
  • (轉貼) 蒼井そら挑戰筋肉擂台 (Misc)
  • .bat批处理(一):@echo off
  • .gitignore
  • .NET LINQ 通常分 Syntax Query 和Syntax Method