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

vue:pinia

Pinia

一.什么是Pinia

Pinia是Vue的专属的最新状态管理库,是Vuex状态管理工具的替代品
1.提供更加简单的API(去掉了mutation)
2.提供符合组合式风格的API(和vue3新语法统一)
3.去掉了modules的概念,每一个store都是一个独立的模块
4.搭配TS一起使用提供可靠的类型推断

感觉就是pinia store里定义了属性和方法 可以被组件引入来使用

添加pinia到vue项目
1.安装

npm install pinia

2.应用

二.counter基础使用

使用Pinia实现计数器案例
pinia的基本用法如下
1.先在stores文件夹下定义一个…

2.然后就可以在组件中使用了

但一般用高级用法,用一个函数来定义一个store

三.getters和异步action

1.getters

getter是用computed来模拟实现的 方法如下

2.异步action

atcion中实现异步和组件中定义数据和方法的风格完全一致

四.storeToRefs函数

作用:辅助保持数据的响应式解构
组件里用store的属性对象
都要xxxx.count等等

那解构一下可不可以直接用count呢 ?
直接解构不行 会响应式丢失
但用storeToRefs包裹就可以了

原理是什么呢?
不用storeToRefs

打印

用了

打印

可以看到用了storeToRefs打印出来的是ref对象 具备响应式 而没用的打印的是0 无响应式

注意点
storeToRefs只是数据的响应式处理要用到
但方法的响应式直接解构赋值就行

五.总结

http://www.jsqmd.com/news/720098/

相关文章:

  • 点云处理新思路:手把手拆解Point Transformer V2的‘分区池化’如何搞定不规则数据
  • 如何在macOS Finder中实现高效视频预览:QLVideo完整指南
  • 网盘直链智能解析:技术突破开启下载效率革命
  • 2026年粘钢加固公司最新推荐/房屋加固,基础加固,注浆加固,楼房加固,碳纤维布加固 - 品牌策略师
  • 《AI大模型应用开发实战从入门到精通共60篇》026、模型量化技术:GPTQ、AWQ与GGUF对比与实战
  • HBuilderX插件开发避坑指南:从package.json配置到发布上架的全流程实战
  • 避坑指南:EMX Modelgen 2.2破解后,如何在Virtuoso中成功调用并验证?
  • 2026年宜昌企业数字化获客完全指南:短视频全案+GEO本地精准推广实战方案 - 企业名录优选推荐
  • BiliTools跨平台哔哩哔哩工具箱部署指南:构建高性能视频解析与AI总结系统
  • 2026年客服对话机器人教程,快速搭建文本自动回复会话能力 - 品牌2026
  • 3步搞定城通网盘高速下载:免费直连提取工具终极指南
  • League Akari终极指南:如何用智能工具提升英雄联盟游戏体验
  • 2026年全国沥青筑路设备采购指南:德州源头厂家深度评测与方案对标 - 企业名录优选推荐
  • 告别HAL_Delay:在STM32中断服务函数中实现精准延时的三种替代方案(附代码)
  • 2026年如何安装Hermes/OpenClaw?阿里云搭建及token Plan配置攻略
  • 从零开始:5步完成黑苹果配置的OpCore-Simplify完全指南
  • 从MATLAB到C++实战:手把手教你移植Savitzky-Golay滤波器(含Eigen库边缘处理避坑指南)
  • 从零到生产:手把手教你用FortiGate VM搭建企业级虚拟化安全实验室
  • Vercel静态站被墙别慌!手把手教你用Cloudflare免费CDN+域名解析搞定DNS污染
  • 新市场与新场景推动嵌入式系统研发走向统一开发平台
  • 别再踩坑了!Vue项目里用vue-pdf-app预览PDF,这个CSS样式不设置它就不显示
  • 3步智能视频转PPT:从视频中自动提取幻灯片的完整指南
  • 2026年全国沥青筑路设备采购指南:德州源头厂家深度评测与官方直达通道 - 企业名录优选推荐
  • 中小商家线上店铺开通工具排行|零代码、高适配,避坑指南附推荐 - FaiscoJeff
  • 从500MB到50GB无缝处理,PHP 8.9分块架构设计四步法:校验→分片→并行→合并,一步错全盘崩!
  • Joy-Con Toolkit完整指南:轻松掌控Switch手柄的开源解决方案
  • PHP 9.0正式版发布72小时后,我们压测了17家AI Bot厂商代码——93%存在协程上下文泄漏,你中招了吗?
  • Python winreg实战:手把手教你备份/恢复IE浏览器设置(含完整代码)
  • 【VS Code Dev Containers终极优化指南】:20年专家实测5大瓶颈+3倍构建提速方案
  • 2026国内高温压力变送器十大品牌权威揭晓 - 仪表人叶工