chore: add dispose in playground

diff --git a/packages/playground/src/views/AllStoresDispose.vue b/packages/playground/src/views/AllStoresDispose.vue
new file mode 100644 (file)
index 0000000..1086255
--- /dev/null
+++ b/packages/playground/src/views/AllStoresDispose.vue
@@ -0,0 +1,29 @@
+<template>
+  <p>
+    I have a store "{{ userStore.name }}". I have
+    {{ cartStore.items.length }} items in the cart.
+  </p>
+  <div>
+    <p>Counter: {{ counterStore.double }} = 2 x {{ counterStore.n }}</p>
+    <button @click="counterStore.increment(10)">Increment</button>
+    <button @click="counterStore.fail()">Fail</button>
+    <button @click="counterStore.decrementToZero(300)">Countdown!</button>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useUserStore } from '../stores/user'
+import { useCartStore } from '../stores/cart'
+import { useCounter } from '../stores/counter'
+import { onUnmounted } from 'vue-demi'
+
+const userStore = useUserStore()
+const cartStore = useCartStore()
+const counterStore = useCounter()
+
+onUnmounted(() => {
+  userStore.$dispose()
+  cartStore.$dispose()
+  counterStore.$dispose()
+})
+</script>