petite-vue sample 5

{{ count }}

{{ count }}

<script src="https://unpkg.com/petite-vue" defer init></script>
<script defer>
function Counter(props) {
  return {
    count: props.initialCount,
    inc() {
      this.count++
    },
    mounted() {
      console.log(`I'm mounted!`)
    }
  }
}
</script>

<div v-scope="Counter({ initialCount: 1 })" @mounted="mounted">
  <p>{{ count }}</p>
  <button @click="inc">+1</button>
</div>

<div v-scope="Counter({ initialCount: 2 })">
  <p>{{ count }}</p>
  <button @click="inc">+1</button>
</div>

元記事を表示する