https://book.vue.tw/CH1/1-7-lifecycle.html

生命週期可以分為不同的階段，主要包括以下幾個：

1. 創建（Creation）：

   • beforeCreate: 在實例初始化之後，但是 data 和 events 被初始化之前被調用。
   • created: 實例已經創建，data 被設置，但是尚未生成 DOM 和掛載到網頁上。

   <aside> 💡 API請求最早可以在created hooks裡面請求

   </aside>

2. 掛載（Mounting）：

   • beforeMount: 在 Vue 實例掛載（mount）到 DOM 元素之前被調用。
   • mounted: Vue 實例已經掛載到 DOM 上，可以進行 DOM 相關的操作。

   <aside> 💡 在nuxt及composition API中不會將非同步或是API請求寫在setup會有問題，會寫在mounted，因此有一派會傾向統一寫在mounted

   </aside>

3. 更新（Updating）：

   • beforeUpdate: 數據更新時，DOM 尚未重新渲染之前被調用。
   • updated: 數據更新且 DOM 重新渲染後被調用。

4. 銷毀（Destruction）：

   • beforeUnmount（Vue2.x:beforeDestroy）: 在 Vue 實例被摧毀之前調用。
   • unmounted（Vue2.x:destroyed）: Vue 實例被摧毀後調用。

• 使用場景1-初始化資料：
• 使用場景2-呼叫API：
• 使用場景3-計時器：
• 使用場景4-使用函式庫（如地圖leaflet, mapbox或GSAP)

在哪個生命週期使用非同步請求（如fetch API)

ref & $refs

$nextTick