[Vuejs]-Vue3 / Nuxt3 – how to use props directly in setup

0👍

Consider using a computed property instead of a ref. Computed properties inherently monitors their reactive dependencies, so any changes in props.fruit will effectively trigger reactivity.

Code Changes:

<script lang="ts" setup>
  const props = defineProps<{ fruit: string }>()
  const fruitColor = computed<FruitColor>(() => getColor(props.fruit));  
</script>

Leave a comment