pinia的getters操作
类似与组件的计算属性 getters: { number10(state) { return state.number + 10 } }, 组件中直接使用即可
pinia的getters操作
发布时间:2023-10-12 (2023-10-12)

类似与组件的计算属性

getters: {
    number10(state) {
        return state.number + 10
    }
},

组件中直接使用即可

<template>
  <div>
    <div>
      name:{{ name }}
      number: {{ number }}
      coun10: {{ store.number10 }}
    </div>
  </div>
</template>

<script setup>
import {useStore} from "./store/index.js";
import {storeToRefs} from "pinia"

const store = useStore()
// 这样会丢失响应式
const {name, number} = storeToRefs(store)

</script>

将参数传递给getter

getters: {
  getNumber: (state) => {
    return (count) => state.number + count
  },
},

组件中使用

<template>
  <p>User 2: {{ state.getNumber(2) }}</p>
</template>

请注意,在执行此操作时,getter 不再缓存,它们只是您调用的函数