pinia简单使用

新命令-创建vue3项目

vue create 方式使用脚手架创建项目，vue cli处理，
vue3后新的脚手架工具create-vue 使用npm init vue@latest 命令创建即可。

在pinia中，将使用的组合式函数识别为状态管理内容
自动将ref 识别为stste,computed 相当于 getters,function 相当于 actions

export const useCounterStore = defineStore('counter', () => {
  const count = ref(10)
  const doubleCount = computed(() => count.value * 2)
  function increment() {
    count.value++
  }

  return { count, doubleCount, increment } //导出的数据
})

在vue里面直接引入使用使用

<script setup>
	import {useCounterStore} from "../stores/counter"
	// useCounterStore是引入defineStore的结构，需要执行 调用并赋值保存，直接使用。
	const countStore=useCounterStore()
</script>
<template>
  <div class="about">
    <h1>count:{{ countStore.count }}</h1>
    <h1>2*count:{{ countStore.doubleCount }}</h1>
  </div>
</template>

使用vite 创建vue3项目

npm init vite@latest