Vue3 更新至V3.5

vue3 stable已經正式更新到v3.5了，基本上只是個小改版，語法上沒有什麼太大的改變，執行速度變快及記憶體使用量變少。

相關資訊可以至 Announcing Vue 3.5 | The Vue Point (vuejs.org) 觀看

筆記一下可能會用到的部份

響應式Props解構

props解構後的變數仍保有響應式結構

import { watchEffect } from 'vue'

const { count } = defineProps(['count'])

watchEffect(() => {
  console.log(count)
})

範例中的count直接是響應式數據

useTemplateRef

改變獲取DOM元素的方法為useTemplateRef，原本是先在html的tag中設定ref=’xxx’,然後設定xxx=ref(null)，現在改為useTemplateRef(‘xxx’)

<script setup>
import { useTemplateRef } from 'vue'
const divEl = useTemplateRef('xxx');
</script>

<template>
  <div ref="xxx"></div>
</template>a