import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
export const useCounterStore = defineStore('counter', () => {
let timer:any;
const count = ref(0)
const n1 = ref(9)
const doubleCount = computed(() => count.value * 2)
function increment() {
clearTimeout(timer)
timer= setTimeout(() => {
count.value++;
timer = null
}, 500);
}
return { count, doubleCount, increment ,n1}
})
<template>
<div>
<button @click="changePinia">改变pinia =>> {{ p.count }}</button>
<h1>{{ dbl }}</h1>
<h1>{{ n1 }}</h1>
<h1>{{ count }}</h1>
</div>
</template>
<script setup lang="ts">
import { useCounterStore } from "@/stores/counter";
import {computed} from 'vue'
import {storeToRefs} from 'pinia'
let p = useCounterStore();
let {n1,count} =storeToRefs(p);
let dbl = computed(()=>{
return p.doubleCount
})
let changePinia = () => {
p.increment();
};
</script>
<style scoped></style>