diff options
Diffstat (limited to 'examples/with-nanostores/src/components/AdminsVue.vue')
-rw-r--r-- | examples/with-nanostores/src/components/AdminsVue.vue | 30 |
1 files changed, 30 insertions, 0 deletions
diff --git a/examples/with-nanostores/src/components/AdminsVue.vue b/examples/with-nanostores/src/components/AdminsVue.vue new file mode 100644 index 000000000..68dcd2065 --- /dev/null +++ b/examples/with-nanostores/src/components/AdminsVue.vue @@ -0,0 +1,30 @@ +<template> + <h1>Vue</h1> + <ul> + <li v-for="user in list" :key="user.name"> + {{JSON.stringify(user, null, 2)}} + </li> + </ul> + <div> + <h3>Counter</h3> + <p>{{count}}</p> + <button @click="decreaseCounter">-1</button> + <button @click="increaseCounter">+1</button> + </div> + <br /> +</template> + +<script> + import { useStore } from 'nanostores/vue' + + import { admins } from '../store/admins.js' + import { counter, increaseCounter, decreaseCounter } from '../store/counter.js' + + export default { + setup() { + const list = useStore(admins) + const count = useStore(counter) + return { list, count, increaseCounter, decreaseCounter } + } + } +</script> |