首页/ 学科题库/ pinia/ Store Setup 函数式写法
pinia 实战教程

Store Setup 函数式写法

2026-06-04 约 7 分钟 juanwangdev

Store Setup 函数式写法

Store Setup 函数式写法是 Pinia 学习中的单个核心知识点,下面直接说明用法。

定义

Store Setup 函数式写法是 Pinia 使用中的一个独立知识点,核心作用是:使用setup函数返回响应式状态,掌握更接近Composition API的定义方式。

语法

常用语法是在 Store 定义或组件调用处完成配置与使用。

JavaScript
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'

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

  return { count, double, increment }
})

示例

JavaScript
import { ref, computed } from 'vue'
import { defineStore } from 'pinia'

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

  return { count, double, increment }
})

注意事项

保持 Store 职责单一,避免把无关业务状态集中到同一个 Store。

要点总结

  • Store Setup 函数式写法 只解决当前知识点对应的问题。
  • 优先使用 Pinia 官方 API,避免引入多余封装。
  • 示例代码应保持 Store 简洁、职责清晰。
想在手机上练这篇的配套题目?
使用微信 卷王开发者小程序/App,首页顶部扫一扫识别下方二维码,即可解锁本讲对应真题与错题本。
了解产品 App
← 上一篇 在组件中引入 Store 下一篇 → Store 命名规范