Pinia 初始化 store

Question

流程：

新建一个文件夹 Store

新建名称文件 store-namespace/index.ts

export const enum Names {
    Test = 'TEST'
}

新建文件 index.ts

import { defineStore } from 'pinia'
import { Names } from './store-namespace'

// store 定义的 defineStore()，需要一个唯一的名称，作为第一个参数传递
// 这个名称，也称为 id，是必要的，Pania 使用它来将商店连接到 devtools。将返回的函数命名为 use...是可组合项之间的约定，以使其使用习惯。
export const useTestStore = defineStore(Names.Test, {
    // State 必须箭头函数返回一个对象，在对象里面定义值
    state: () => {
        return {
            count: 0
        }
    },
    //类似于 computed 可以帮我们去修饰我们的值
    getters: {

    },
    //可以操作异步 和 同步提交 state
    actions: {

    }
})

在组件中导入使用

<template>
  <div>
 		<!-- State 是允许直接修改值的 -->   
    <button @click="Test.count++">加加加</button>
    {{ Test.count}}
  </div>
</template>

<script setup lang="ts">
import { useTestStore } from "./store"
const Test = useTestStore();

</script>