Vue3 学习 4

pinia

集中式状态(数据)管理 redux vuex pinia

准备一个效果

第一部分Count:

第二部分LoveTalk:

App.vue呈现:

搭建pinia环境

存储+读取数据

1.Store是一个保存:状态、业务逻辑的实体,每个组件都可以读取、写入 它。

2.它有三个概念:state、getter、action,相当于组件中:data、computed和methods

3.具体编码:



修改数据(三种方式)


storeToRefs

  • 借助于storeToRefs将store中的数据转为ref对象,方便在模板中使用
  • 注意:pinia提供的storeToRefs只会将数据做转换,而vue的toRefs会转换为store中数据

getters

1.概念:当state中的数据,需经过处理后再使用,可以使用getters配置

2.追加getters配置

$subscribe的使用

store组合式写法

相关推荐
小郑加油几秒前
python学习Day8-9天:函数(def)的基础运用
python·学习
学掌门4 分钟前
数据分析师初级—中级—高级,每个阶段都需要学习什么?
大数据·学习·数据分析·数据分析师
rainbow7242448 分钟前
零基础职场人线上学习AI,是否支持线上考试?
人工智能·学习
小羊Yveesss10 分钟前
2026年前端开发新趋势:智能协同、工具革新与场景深耕
前端·ai
Dxy123931021619 分钟前
HTML中的Canvas可以干哪些事情
前端·html
悟乙己23 分钟前
解析 Agent 时代的 HTML PPT SKILLS: html-ppt-skill
前端·html·powerpoint
ZC跨境爬虫24 分钟前
跟着 MDN 学 HTML day_2:(表单分组与高级输入控件实战)
前端·javascript·css·ui·html
handler0129 分钟前
Git 核心指令速查
linux·c语言·c++·笔记·git·学习
噜噜噜阿鲁~31 分钟前
python学习笔记 | 8.3、函数式编程-匿名函数
笔记·python·学习
星幻元宇VR32 分钟前
VR单人地震体验平台助力防灾减灾教育
科技·学习·安全·vr·虚拟现实