前言 假設今天當你打開 figma，準備開始刻前端，發現很多按鈕都是 #9f86ff 這個顏色， 他甚至已經是你的主色了，你卻只能一次一次的複製這個色號，哪天一不小心打成 #9f96ff，哪邊怪怪的卻...
今日筆者將參考 Vue.js 官方所提供的互動式教學，並以此為基礎再對部份內容做更深入的說明，那麼廢話不多說，我們直接開始吧！ .vue檔案格式：SFC 這種特別的檔案格式被稱為 Single-Fil...
今天將延續昨天的內容，繼續介紹插槽 Slots 將父元件的內容渲染在子元件中指定的位置 條件插槽 若要根據插槽是否存在來渲染內容，可以使用 $slots 屬性和 v-if 指令。 以下是官方文件的範...
上一篇我們聊到了 Components 的使用方式。那讀者可能會想：網路上有些文章教 Vue2，有些文章教 Vue3，那這兩個到底差在哪？今天我們就來聊聊 Vue2 和 Vue3 的差異。 Vue2...
就是要帶大家認識 Vue 元件「出生到死亡」的整個過程，以及可以在什麼時間點插入程式邏輯。 為什麼叫「生命週期」？ 想像一個元件就像一艘飛船： 建造 → 發射 → 執行任務 → 回收 → 解體Vue...
在前面幾天探討了元件資料傳遞的方式，不過若想要傳遞的是 DOM 內容，使得元件在不同的地方，可以渲染不同的內容，並且仍保有相同的樣式，則需要透過使用插槽 Slots，將父元件的內容渲染在子元件中指定的...
前面幾天的內容是在探討父元件和子元件間的資料傳遞，不過當根元件要傳遞到最底部的元件時，如果使用 props 一層一層傳遞，可能會影響到中間層元件造成額外的麻煩，因此透過使用 provide 和 inj...
在熟悉HTML、CSS及JavaScript之後，接下來可以嘗試使用Vue框架，進行網頁前端的撰寫。有別於HTML、CSS及JavaScript的彼此獨立而各自分工，Vue藉由「組件(componen...
tldr: Vue.js 是一個有彈性的JavaScript框架，讓用戶可以循序漸進地使網站越家豐富 在淺談完網頁的基礎，HTML5之後，今天筆者想與各位分享一下一個對於開發網頁時十分便利的一款工...
這一系列的第一個重頭戲來啦！ Vue 3.6 把底層訊號系統換成 Alien Signals，效能和記憶體占用大幅下降，這意味著：我們在寫 composable 時，不需要任何修改，就能無痛吃到新引擎...