1 什么是Pinia
Pinia和Vuex的区别
3 使用Pinia
4 认识Store
5 pinia的基本使用
1 创建pinia
在app中使用pinia
2 创建store
可以创建多个store
// 定义关于counter的store
import {
defineStore } from 'pinia'
//创建store
const useCounter = defineStore("counter", {
state: () => ({
count: 99,
})
})
//导出
export default useCounter
3 使用store
<template>
<div class="home">
<h2>Home View</h2>
//模板中使用
<h2>count: {
{
counterStore.count }}</h2>
<h2>count: {
{
count }}</h2>
<button @click="incrementCount">count+1</button>
</div>
</template>
<script setup>
import {
storeToRefs } from 'pinia'
//导入store
import useCounter from '@/stores/counter';