前面幾天我們重新回顧了Vue的語法結構，還有各種內建提供的指令用法。今天的重點放在 「如何把自己寫的內容」 定義成可以複用的函式，以及 「如何自訂指令」 ？讓我們把Vue更活用，Let's go！ 組...
<textarea> 與 <input type="text"> 有需多相似之處，甚至大多數的特性都是共通的，例如都可以接收 placeholder、di...
嗨一大家，記得之前我們在屬性綁定章節，有講到 CSS 樣式可以使用 v-bind 屬性綁定樣式嗎～ 但官方文件後來卻提到了： 但是，在處理比較複雜的綁定時，通過拼接生成字符串是麻煩且易出錯的。因此，...
哈囉，大家好！經過前面的努力，我們已經成功建立了 Nuxt 的開發環境，並初步了解了它的使用方式。在前一篇文章中，我們建立了第一個頁面，並準備好了後續開發所需的套件。現在，是時候深入了解 Nuxt 的...
讓你的計時器不再無聊！帶你實現進度條的互動視覺化 你是否曾經想過，讓時間不只是冷冰冰的數字，而是變成一個動態、直觀、充滿視覺衝擊的體驗？ 今天，我們要用 Vue.js 帶你進入計時器與圈圈進度條的...
目錄 定義組件的兩種方式 - SFC 單文件組件與 CDN 版本 組件註冊的兩種方式 - 全域註冊與區域註冊 結論 在 Day 5 我們提到可以將應用拆分為根組件和多個組件實例，並將功能模塊...
計算屬性(補充) 示例 模板中的表達式雖然方便，但也只能用來做簡單的操作。如果在模板中書寫太多邏輯，會讓模板變得臃腫，難以維護。例如說，我們有這樣一個包含嵌套數組的對象： const author =...
響應式基礎補充 討論:為何要使用ref()而非普通的變量? 為什麼我們需要使用帶有 .value 的 ref，而不是普通的變量？ 當你在模板中使用了一個 ref，然後改變了這個 ref 的值時，Vue...
在現代前端開發中，Vue 3 和 TypeScript 的結合成為了許多開發者的首選。這是因為 TypeScript 提供了靜態類型檢查功能，讓程式碼更具可讀性和可維護性，並能及早捕捉錯誤，提升開發效...
上次介紹插槽時有看到v-for渲染的案例，v-for是Vue官方提供的列表渲染(List rendering)指令之一，可以用來遍歷陣列或對象，在模板中生成一组相同結構的元素，使用起來滿簡單，但是實務...