webfansplz / vuejs-challenges

Collection of Vue.js challenges
https://vuejs-challenges.netlify.app/
MIT License
2.71k stars 187 forks source link

6 - shallow ref #2693

Open LauGM opened 6 months ago

LauGM commented 6 months ago
<script setup lang="ts">
import { shallowRef, watch } from "vue"

const state = shallowRef({ count: 1 })

// Does NOT trigger
watch(state, () => {
  console.log("State.count Updated")
}, { deep: true })

/**
 * Modify the code so that we can make the watch callback trigger.
*/
state.value= {count:2}

</script>

<template>
  <div>
    <p>
      {{ state.count }}
    </p>
  </div>
</template>