pinia学习3：Getter使用

无名H

已于 2024-05-16 16:18:41 修改

阅读量1.3k

点赞数 6

CC 4.0 BY-SA版权

分类专栏： pinia 文章标签：学习 javascript 前端 vue.js 开发语言前端框架

于 2024-04-28 09:16:34 首次发布

本文链接：https://blog.youkuaiyun.com/qq_40358970/article/details/138260299

Getter 完全等同于 Store 状态的计算值。它们可以用 defineStore() 中的 getters 属性定义。他们接收“状态”作为第一个参数以鼓励箭头函数的使用：

Getters 介绍

计算属性：Getters 是基于 store 中的状态进行计算的函数。它们允许你根据 store 的当前状态动态地返回一些值。
响应式：当 store 中的相关状态发生变化时，依赖于这些状态的 getters 会自动重新计算。
可组合：你可以在 getters 中使用其他 getters 或 actions，以创建更复杂的计算逻辑。

Getters 使用

1. 定义 Getters

可以使用 defineStore 函数来定义 getters。每个 getter 是一个函数，它接受 store 的状态作为第一个参数。

import { defineStore } from 'pinia';  
  
export const useMyStore = defineStore({  
  id: 'myStore',  
  state: () => ({  
    count: 0,  
  }),  
  getters: {  
    doubleCount: (state) => {  
      return state.count * 2;  
    },  
    // 你也可以使用其他 getters 或 actions  
    doubleCountPlusOne: (state, getters) => {  
      return getters.doubleCount + 1;  
    },  
  },  
  actions: {  
    increment() {  
      this.c