iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

真的好想離開 Vue 3 新手村 feat. CompositionAPI 系列

在初學 Vue 往 real world Vue 的路上,希望沒有誤入歧途。
住在 Vue 新手村一個多月,針對這段期間特別疑惑的地方,整理成攻略 30 篇,希望能帶給剛入住的鄰居們一點點幫助。

鐵人鍊成 | 共 31 篇文章 | 86 人訂閱 訂閱系列文 RSS系列文
DAY 21

Day 21: 來發 API 吧!Async Composition API setup() feat. <Suspense>

前言 接下來幾天會以「在 Vue 3 Composition API 處理非同步( 發 API )」為主軸,從新手的角度出發,告訴大家可以在哪些地方、時機發 A...

2022-10-06 ‧ 由 安揪拉 分享
DAY 22

Day 22: Composition API async setup() + await 的限制

上集回顧 Composition API 元件中的 setup() 函式可以作為非同步函式使用,在內部可以使用關鍵字 await 等待非同步陳述式執行。 一切聽...

2022-10-07 ‧ 由 安揪拉 分享
DAY 23

Day 23: 來發 API 吧!Lifecycle Hooks and Navigation Guards 你要哪一個?

Outline Lifecycle Hooks 快速總覽 Navigation guards 快速總覽 發 API 挑哪個? 今天會著重介紹觸發時機,可以在...

2022-10-08 ‧ 由 安揪拉 分享
DAY 24

Day 24: Before Pinia - 什麼是狀態(state)?為什麼需要狀態管理器?

前言 Vue 文件常常出現 &quot;state&quot; 這個單字,像是在 Reactivity Fundamentals 篇章中,會用 &quot;st...

2022-10-09 ‧ 由 安揪拉 分享
DAY 25

Day 25: 來發 API 吧!Pinia 語法學完馬上用

前言 在 Day 21: 來發 API 吧!Async Composition API setup() 中,是在元件準備渲染時,才在 setup 內發 API...

2022-10-10 ‧ 由 安揪拉 分享
DAY 26

Day 26: 在 Vue router - Navigation Guard 中使用 Pinia store 的小眉角

前言 在 route 中使用 Pinia store 時,不同的 route guard 常常會需要用到同一個 store,我一開始想要少寫一點程式碼XD,減少...

2022-10-11 ‧ 由 安揪拉 分享
DAY 27

Day 27: 從 VueUse - useAsyncState 認識 Composable 和非同步處理

前言 會想寫這個題目有兩個原因: 想認識 composable 函式,體驗 Composition API 的強大之處,為什麼可以讓跨元件複用程式碼變得更方便...

2022-10-12 ‧ 由 安揪拉 分享
DAY 28

Day 28: Quasar 新手指南 - 從安裝到使用

前言 其實一直很猶豫要不要寫這篇,因為 UI Framework 最終還是要從官方文件去看使用方式。但又想起當初,自己一開始使用 Quasar 的時候,進入官網...

2022-10-13 ‧ 由 安揪拉 分享
DAY 29

Day 29: Vue 響應式基礎 - watch & computed 不踩坑

前言 在 Day 9 和 10 的文章中,我們提到 Vue 3 響應式基礎 - reactive &amp; ref,主要用來攔截資料的讀取跟寫入,讓 Vue...

2022-10-14 ‧ 由 安揪拉 分享
DAY 30

Day 30: Vue 3 響應式原理 - effect 如何響應 (無敵簡化版)

註:本篇屬於沒有很重要,但我很好奇系列 這篇不會著重在原始碼,主要是介紹 Vue 是用什麼概念去蒐集依賴。主要學習資源是 Vue Mastery、官網文件和部份...

2022-10-15 ‧ 由 安揪拉 分享