前端状态管理工具pinia:pinia是什么?相较于Vuex,pinia有什么优势,如何手动添加pinia到Vue3项目中

1.什么是pinia?

Pinia是Vue的最新状态管理工具,是Vuex的替代品。

2.相较于Vuex,pinia有什么优势?

1.提供更加简单的API(去掉了mutation)

倘若你学习过vuex,你一定会发现很多很多不合理的地方,实现一个功能可能要在state定义数据,在mutations中书写更改state数据的方法,在actions中写方法触发mutiaions中的事件,和传值可以说非常的繁琐,而在pinia中只有state,actions,getters三个,去掉了modules和mutations


2.提供符合,组合式风格的API(和 Vue3新语法统一)

3.去掉了 modules 的概念,每一个 store 都是一个独立的模块

4.配合TypeScript 更加友好,提供可靠的类型推断

3.手动添加pinia到Vue3项目中

1.使用Vite创建一个空的Vue3项目

npm create vue@latest

 

2.按照官方文档 安装 pinia到项目中。

pinia官方网:

https://pinia.vuejs.org/zh/index.html

1.下载用包管理器安装 pinia

yarn add pinia
# 或者使用 npm
npm install pinia

2.改动main.js

import { createApp } from 'vue'
//导入pinia
import { createPinia } from 'pinia'
import App from './App.vue'
const pinia=createApp()

// createApp(App).use(pinia).mount('#app')
// 当然上面的是链式的写法也可以下面分开写成:
const app=createApp(App)
app.use(pinia)
app.mount('#app');

//当然这里只是简单演示,一般开发过程中会将pinia专门放到一个文件中,然后导入到main.js中

 

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-13 23:36:02       66 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-13 23:36:02       70 阅读
  3. 在Django里面运行非项目文件

    2024-07-13 23:36:02       57 阅读
  4. Python语言-面向对象

    2024-07-13 23:36:02       68 阅读

热门阅读

  1. 计算机如何学习

    2024-07-13 23:36:02       16 阅读
  2. 要修改已经推送到远程仓库的提交信息

    2024-07-13 23:36:02       18 阅读
  3. linux 设置nginx开机自启

    2024-07-13 23:36:02       22 阅读
  4. c++贪心算法

    2024-07-13 23:36:02       19 阅读
  5. ArcGIS Pro SDK (八)地理数据库 4 查询

    2024-07-13 23:36:02       16 阅读
  6. 文本语言的上升沿写法

    2024-07-13 23:36:02       16 阅读
  7. Aop实现后端数据重复提交

    2024-07-13 23:36:02       23 阅读
  8. Android C++系列:Linux进程间关系

    2024-07-13 23:36:02       21 阅读
  9. thinkphp5多层with关联查询错误问题

    2024-07-13 23:36:02       26 阅读
  10. Understanding EtherCAT Device Serial Number Checking

    2024-07-13 23:36:02       20 阅读
  11. 1.1 Android启动概览

    2024-07-13 23:36:02       22 阅读
  12. HttpUtils工具类

    2024-07-13 23:36:02       19 阅读
  13. 风景区服务热线系统:智能化时代的旅游新选择

    2024-07-13 23:36:02       21 阅读
  14. acnconda虚拟环境管理笔记

    2024-07-13 23:36:02       21 阅读
  15. Spring基础知识

    2024-07-13 23:36:02       18 阅读