docs: demonstrate the multiple useState with same key (#5059)

* Better demonstrate the UseState concept

Add another counter instance with the same id and show that they change in parallel

* Apply suggestions from code review

Co-authored-by: pooya parsa <pyapar@gmail.com>
This commit is contained in:
HG 2022-05-20 10:12:35 +01:00 committed by GitHub
parent cad9ce4a6a
commit 173fbfd06e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,10 +1,12 @@
<script setup> <script setup>
const counter = useState('counter', () => Math.round(Math.random() * 1000)) const counter = useState('counter', () => Math.round(Math.random() * 1000))
const sameCounter = useState('counter');
</script> </script>
<template> <template>
<NuxtExampleLayout example="composables/use-state"> <NuxtExampleLayout example="composables/use-state">
<div>Counter: {{ counter }}</div> <div>Counter: {{ counter }}</div>
<div>Same Counter: {{ sameCounter }}</div>
<div> <div>
<NButton class="font-mono" @click="counter++"> <NButton class="font-mono" @click="counter++">
+ +