还在用vuex?来了解一下pinia 还在用vuex?来了解一下pinia

1. 什么是pinia
2.优势
3. 使用（非常简单）
总结

1. 什么是pinia 通俗的讲：
① vuex精简版，而且vue官方更加推荐使用。
②优势又完胜于vuex ，下面我们来了解下pinia。

2.优势

pina	vuex
pinia 同时支持vue2和vue3	vue2要用vuex 3 版本 vue3要用vuex 4 版本
不分同步异步，更好的ts支持	分同步异步，不太兼容ts
享受自动补全 …	需要注入，导入函数，调用他们 …

3. 使用（非常简单） ① 安装

npm install pinia

②在 main.js 中加入

import { createApp } from 'vue'import App from './App.vue'import { createPinia } from 'pinia'//导入piniaconstpinia = createPinia(); //调用创建piniacreateApp(App).use(pinia).mount('#app')

③去创建 pinia 仓库
一般选在 /src下的 store 文件夹下例：创建为 pinia.js
/src/store/pinia.js 为：

import { defineStore } from 'pinia'export const PiniaStore = defineStore('main',{//导出 pinia仓库state:() => { //相当于全局的 data()return {name:'张三',age:18}},getters:{},//相当于全局的computedactions:{}//相当于全局methods})

③使用（非常容易）
以/src/view/index.vue 为例：
Vue3写法：

Vue2写法：

大家不用担心用pinia会出问题，官方已经明确说了pinia是vuex 5版本的理念，而且官方更推荐pinia而非vuex

总结 【还在用vuex?来了解一下pinia】本篇文章就到这里了，希望能够给你带来帮助，也希望您能够多多关注脚本之家的更多内容!