vue3的pinia(大菠萝)

Pinia是Vue3推荐的状态管理库,作为Vuex的替代者,它简化了状态管理,支持Vue2和Vue3,拥有不需mutations等五大优势。本文将详细介绍Pinia的安装、创建store、使用state、getters、actions以及API应用,包括$reset、$subscribe和$onAction等。
摘要由CSDN通过智能技术生成

一:Pinia简介和五大优势

Pinia是vue生态里Vuex的替代者,一个全新的vue状态管理库。在Vue3成为正式版以后,尤雨溪强势推荐的项目就是Pinia。
那先来看看Pinia比Vuex好的地方,也就是Pinia的五大优势。

  1. 可以对Vue2和Vue3做到很好的支持,也就是老项目也可以使用Pinia。
  2. 抛弃了Mutations的操作,只有state、getters和actions.极大的简化了状态管理库的使用,让代码编写更加容易直观。
  3. 不需要嵌套模块,符合Vue3的Composition api ,让代码更加扁平化。
  4. 完整的TypeScript支持。Vue3版本的一大优势就是对TypeScript的支持,所以Pinia也做到了完整的支持。如果你对Vuex很熟悉的化,一定知道Vuex对TS的语法支持不是完整的(经常被吐槽)。
  5. 代码更加简洁,可以实现很好的代码自动分割。Vue2的时代,写代码需要来回翻滚屏幕屏幕找变量,非常的麻烦,Vue3的Composition api完美了解决这个问题。 可以实现代码自动分割,pinia也同样继承了这个优点。

二:Pinia开发环境安装 

        1.使用Vite就需要先初始化vite:

1|npm init vite@latest

        2.初始化与启动项目

1|npm install
2|npm run dev

        3.pinia的安装:

1|npm install pinia

        4.装好之后可以在package.json里面查看到,可以看到安装的pinia最新版本是2.0.12

 三:用Pinia的方式创建一个store</

  • 5
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值