今日目標 用 Vite + Vue + TypeScript 建立新專案 認識 Vue 專案的基本結構與單檔元件 SFC (.vue) 把 Day 6 的 HTML/CSS 先搬進 Vue（切成基...
我們今天要學習的是 Vue 內建的 <transition> 元件，它能讓你的元素或元件在進入（enter）與離開（leave）時，加上漂亮的動畫效果 ✨。 學習重點 1.什麼是過場效果（...
今天將會運用到前幾日所學到的內容，並開始為專案增加資料庫的存取功能！那麼就讓我們直接開始今日的內容吧！ 建立表格 table 現階段為了方便測試，所以先在 local 建立檔案，到未來筆者將會改使用...
通常在使用者填寫表單時，網頁開發者會預設一定的輸入格式，避免使用者填寫一些不符合預期的內容，導致後續資料清理上所造成的時間浪費，並且若使用者所填寫的內容，與該項目預設格式不相容，將可能導致資料傳送到後...
再次回到最初的Employee.vue程式碼，之前針對互動視窗(modal)，曾以此為例介紹前端組件內的資料傳遞，現在再次查看以下程式碼，可以更深刻了解各標籤實際用途， :modelValue=”...
我們今天localStorage主要就是學會 「如何讓使用者的資料，不會因為重整或關掉瀏覽器就消失」！ 學習概念 1.認識 localStorage 瀏覽器內建的儲存空間（Key-Value 格式）...
好的今天繼續完善我們的小專案各位應該有發現當我們重新整理頁面或是關掉重開後，原本寫好的任務或計劃都不見了因為原本的陣列或變數都是存在記憶體(memory)中，只要我們刷新或重新啟動，記憶體裡的資料就會...
最後，我們再次回到Employee.vue的區塊，這裡要介紹的是v-model雙向綁定的功能，參考如下： <!-- src/views/Employee.vue --> <templ...
雖然還沒到最後一天，但今天打算嘗試將 vue 部署到 github pages 上 (絕對不是在逃避串接資料庫資料ww原本以為 Github Pages 只能部署純 HTML、CSS、JS，在打算找另...
接下來要介紹的實例，是員工資料清單表格<EmployeeTable />，其中涉及到跨組件(component)的資料傳遞，即props(父傳子)及emits(子傳父)，先參考以下程式碼：...