在 Day 3 我們說明了使用 Pinia 來管理應用程式的狀態，例如登入狀態與使用者角色。但光有「狀態管理」還不夠，因為系統需要根據不同角色，決定誰可以看到什麼頁面。 這時候就要引入 Vue Rou...
前言 在 Vue 的使用中你可能會看到 ref 跟 reactive，這是 Composition API 的核心，讓資料具備響應式。 但平平都是用來做變數的引用，到底差在哪裡確實是會讓人有點懷疑，此...
延續昨日的雙向綁定我們也可以搭配 v-for 來渲染選單的 options <template> <div class="box">...
聯繫我 如果有任何問題或建議，歡迎隨時聯繫我： GitHub Email 前言 各位 Vue 的魔法師們！專案一直以來都由 JavaScript 這位自由奔放、充滿創意的藝術家主導。他隨性...
什麼是「狀態 (State)」？ 在開始實作之前，我們需要先釐清一個核心問題： 「當使用者在我們的系統中操作時，有哪些資訊是必須被記錄下來的？」 簡單來說，這些需要被記錄、會隨著時間或操作而改變的...
前言 在前面的篇章中我們快速的帶過 Vite 和 SFC 檔案，今天我們會介紹 Snippet 快速創建 SFC 模板和 Vite 底層如何打包以及 Rolldown 介紹使用。 Snippets 既...
若我們欲使表單輸入框同步給變數值，會使用 v-bind 綁定，再使用 v-on 監聽事件 <input :value="text" @input="even...
若我們想要按下鍵盤觸發某事件，通常會用 handler 的寫法而 Vue 提供了更方便的寫法 event.key = "function"eg. 輸入文字後按下 Enter 能夠直...
如果你已經有 HTML/CSS 基礎，那你大概知道「切版仔」的日常——每天對著設計稿，用 HTML/CSS 拼出一模一樣的網頁畫面。雖然熟練後可以很快完成任務，但有時候你會發現：業界好像不太需要只會切...
專案現況： AI 給我們的 Prototype 在昨天的探索中，我們得知我們的需求「銷售系統」是基於 HTML、CSS 和 JavaScript 的靜態原型（prototype)。每個頁面都是一個獨立...