企业推广方式隐迅推知名_招聘网58同城求职信息_google浏览器官网入口_淘宝新店怎么快速做起来

vue3安装pinia

在全新的Vue 3项目中安装Pinia并进行基础使用。以下是步骤:

1. 安装Pinia

在项目根目录下运行以下命令:

npm install pinia

2. 在main.js中配置Pinia

打开main.js文件,添加以下代码:

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import App from './App.vue'const app = createApp(App)
const pinia = createPinia()app.use(pinia)
app.mount('#app')

3. 创建一个Store

在src目录下创建一个stores文件夹,然后创建一个新文件,例如counter.js:

import { defineStore } from 'pinia'export const useCounterStore = defineStore('counter', {state: () => ({count: 0}),actions: {increment() {this.count++}},getters: {doubleCount: (state) => state.count * 2}
})

4. 在组件中使用Store

在任何Vue组件中,您可以这样使用刚创建的store:

<template><div><p>Count: {{ counterStore.count }}</p><p>Double Count: {{ counterStore.doubleCount }}</p><button @click="counterStore.increment">Increment</button></div>
</template><script setup>
import { useCounterStore } from '../stores/counter'const counterStore = useCounterStore()
</script>