<template>
<div>
pinia原始值: {{ Test.current }} --- {{ Test.name }}
<button @click="change">change</button>
</div>
<hr />
<div>
解构后值: {{ current }} --- {{ name }}
<button @click="change">change</button>
</div>
</template>
<script setup lang="ts">
import { useTestStore } from './store';
import { storeToRefs } from 'pinia';
const Test = useTestStore();
// pinia 解构不具有响应式
// const { current, name } = Test;
// 要使用storeToRefs()
const { current, name } = storeToRefs(Test);
const change = () => {
// Test.current++
// 或
current.value++
}
</script>
<style scoped></style>
四、Vue3中使用Pinia解构Store
最新推荐文章于 2024-05-31 12:13:40 发布
![](https://img-home.csdnimg.cn/images/20240711042549.png)