14.(vue3.x+vite)组件间通信方式之pinia

news2024/11/18 9:23:10

前端技术社区总目录(订阅之前请先查看该博客)

示例效果

在这里插入图片描述

Pinia简介

Pinia 是 Vue 的存储库,它允许您跨组件/页面共享状态。

Pinia与Vuex比较

(1)Vue2和Vue3都支持,这让我们同时使用Vue2和Vue3的小伙伴都能很快上手。
(2)pinia中只有state、getter、action,抛弃了Vuex中的Mutation,Vuex中mutation一直都不太受小伙伴们的待见,pinia直接抛弃它了,这无疑减少了我们工作量。
(3)无需再创建各个模块嵌套(module),Vuex中如果数据过多,我们通常分模块来进行管理,稍显麻烦,而pinia中每个store都是独立的,互相不影响。
(4)良好的Typescript支持,毕竟我们Vue3都推荐使用TS来编写,这个时候使用pinia就非常合适了
(5)体积非常小,只有1KB左右。
(6)pinia支持插件来扩展

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1241996.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2023年全国大学生数学建模竞赛总结

2023年全国大学生数学建模竞赛总结 一.参赛经历二.组队建议赛前准备建模手所需要具备的知识 编程手需要具备的能力 论文手论文手需要学习的知识 比赛过程 全国大学生数学建模竞赛的比赛落下了帷幕,很荣幸我能够获得国家二等奖,这对于我们队伍来说是十分荣幸的,接下来让我进行我…

UniApp打包教程:使用HBuilder X和AppUploader完成原生App云打包和上架指南

UniApp打包教程:使用HBuilder X和AppUploader完成原生App云打包和上架指南" 目录 uniapp进行打包 使用上架工具appuplode进行发包 1.登录appuploder软件 2.登陆开发者App Store后台 uniapp进行打包 在HBuilder X编辑器中打开需要打包的项目,然后…

电脑自动删除文件怎么办?如何恢复?

在数字化时代,电脑已经成为人们不可或缺的工具之一。然而,由于各种原因,我们有时会遇到电脑自动删除文件的情况,这给我们的工作和生活带来了很多不便。那么,当电脑自动删除文件时,我们应该如何处理呢&#…

redis-cluster集群(目的:高可用)

1、特点 集群由多个node节点组成,redis数据分布在这些节点中,在集群中分为主节点和从节点,一个主对应一个从,所有组的主从形成一个集群,每组的数据是独立的,并且集群自带哨兵模式 2、工作原理 集群模式中…

Cookie、Session、CBV加装饰器的三种方法

【0】cookie、session和Token的发展史 【1】Cookie的形式 存储形式:k:v键值对存储位置:客户端缺点:不安全,信息可能会泄露 【2】session的形式 标识符,表示我是当前用户加密出来的数据对敏感信息进行加密…

element-plus的el-dropdown去除鼠标悬浮或点击时的黑边框

设置为outline:unset;或者outline:none;即可 :deep(.el-tooltip__trigger:focus-visible) {outline: unset;}

解决traefik/nginx-ingress-controller配置正确的情况访问域名仍然报错: Connection Refused的问题

最近碰到一个很奇怪的问题: traefik/nginx-ingress-controller配置正确,但是访问ingress配置的host域名就是死活报错: Connection Refused 这样怎么也找不到原因,然后一咬牙直接在其中一台节点yum安装nginx, 通过直接反向代理的方…

高通OTA升级非常规分区方法

高通OTA升级非常规分区方法 1. 高通LE OTA背景2. 高通LE OTA升级方案2.1 SDX12 OTA方案2.2 OTA升级TZ/RPM/Aboot OTA是一个通用述语,常见的解释为over the air。通过这一解释,OTA最开始的概念,是空中升级。后来,又衍生出了FOTA&am…

Git使用基础总结(从小白到新手版)

(꒪ꇴ꒪ ),Hello我是祐言QAQ我的博客主页:C/C语言,数据结构,Linux基础,ARM开发板,网络编程等领域UP🌍快上🚘,一起学习,让我们成为一个强大的攻城狮&#xff0…

BUUCTF [HBNIS2018]excel破解 1

BUUCTF:https://buuoj.cn/challenges 题目描述: 得到的 flag 请包上 flag{} 提交。来源: https://github.com/hebtuerror404/CTF_competition_warehouse_2018 密文: 下载附件,得到一个attachment.xls文件。 解题思路&#xff…

ABB机 器 人 操 作 培 训

目 录 1 培训手册介绍 ---------------------------------------------2 2 系统安全与环境保护 ---------------------------------------------3 3 机器人综述 ---------------------------------------------5 4 机器人示教 --------------------------------------------12…

.Net6 Api Swagger配置

1、定义个Swagger版本&#xff08;组&#xff09;的枚举 namespace WebApp.Enums {/// <summary>/// api版本枚举/// </summary>public enum ApiVersion{/// <summary>/// v1版本/// </summary>v1 1,/// <summary>/// v2版本/// </summary&…

Axios 拦截器 请求拦截器 响应拦截器

请求拦截器 相当于一个关卡&#xff0c;如果满足条件就放行请求&#xff0c;不满足就拦截 响应拦截器 在处理结果之前&#xff0c;先对结果进行预处理&#xff0c;比如&#xff1a;对数据进行一下格式化的处理 全局请求拦截器 axios.interceptors.request.use(config > { /…

电脑开机显示器没反应?5个方法轻松解决!

“各位朋友们&#xff0c;我想问问&#xff0c;电脑开机显示器没反应是为啥呢&#xff1f;有什么方法可以解决这个问题吗&#xff1f;感谢感谢&#xff01;” 在使用电脑时&#xff0c;用户可能会遇到各种各样的情况。电脑开机显示器没反应也是一个比较常见的电脑问题。遇到这种…

Springboot+vue的新冠病毒密接者跟踪系统(有报告)。Javaee项目,springboot vue前后端分离项目

演示视频&#xff1a; Springbootvue的新冠病毒密接者跟踪系统(有报告)。Javaee项目&#xff0c;springboot vue前后端分离项目 项目介绍&#xff1a; 本文设计了一个基于Springbootvue的新冠病毒密接者跟踪系统&#xff0c;采用M&#xff08;model&#xff09;V&#xff08;v…

JSP EL表达式获取list/Map集合与java Bean对象

上文 JSP EL表达式基本使用 中 我们对EL表达式做了一个基本的了解 也做了基础的字符串数据使用 那么 我们可以来看一下我们的集合 首先 list 这个比较简单 我们直接这样写代码 <% page import"java.util.ArrayList" %> <% page import"java.util.Lis…

两种常见EMC整改流程!|深圳比创达电子EMC

如何定位EMC整改计划可以分为两点&#xff1a; 1、根据以往的整改经验来进行判断&#xff1b; 2、比较测试&#xff0c;测试结束后根据测试仪器提供的数据进行问题分析。 下面介绍两种常见的EMC整改流程。 1、RE超标整改流程 首先要测量超标(临界)点&#xff0c;作为参考值…

注册并实名认证华为开发者账号

首先 我们访问 https://www.harmonyos.com/ 访问鸿蒙官方网站 右上角 我们点击 登录 然后 我们选择注册 然后 注册方式 有邮箱和手机号的注册 这边 看大家需要 如果像我不怎么登邮箱这种 建议还是选择手机号注册 这里 居住地区 应该就是默认中国吧 然后 手机号 验证码 密码…

入选《数据结构与算法领域内容帮榜》第44名

入选《数据结构与算法领域内容帮榜》第44名

Spring-jdbcTemplate-配置数据库连接池

1、jdbc.properties jdbc.drivercom.mysql.cj.jdbc.Driver jdbc.urljdbc:mysql:///studb jdbc.userroot jdbc.pwd123456 2、beans.xml <?xml version"1.0" encoding"UTF-8"?> <beans xmlns"http://www.springframework.org/schema/beans&…