今年第一次參加鐵人賽，心情其實有點複雜。興奮的是終於能 push 自己每天輸出，但也緊張自己能不能撐滿 30 天。之前我在專案裡最常用的還是 React、HTML、CSS，Vue.js 對我來說幾乎...
今天的內容將介紹條件渲染的兩種常見方式：v-if 和 v-show，雖然兩者功能相似都是「依照條件判斷決定內容是否呈現在畫面上」，但兩者仍然存在一些差異。 v-if 語法 透過條件判斷來控制內容是否渲...
今天要來學習有關 slot 的用法，slot 就是子元件模板裡的內容擺放位，而內容則由父元件提供，子元件只負責外框與樣式eg. <template> <button class=...
前言 在 Vue 開發中，我們經常需要根據條件顯示或隱藏特定 DOM 元素。 常見的情境有： 表單錯誤訊息只在輸入驗證失敗時顯示。 API 請求後才顯示資料、SSR 導致的錯誤。 根據使用者角色顯示...
前言 在 Vue 開發中，我們經常需要根據條件顯示或隱藏特定 DOM 元素。 常見的情境有： 表單錯誤訊息只在輸入驗證失敗時顯示。 API 請求後才顯示資料、SSR 導致的錯誤。 根據使用者角色顯示...
在搜尋參考資料的時候找到這到二篇文章： 從頭開始學習開發 Chrome extension （v3 版本） 使用 HTML / CSS / JS 開發 有清楚的 PR review messag...
在Day5 Vue指令-屬性綁定與列表渲染中有介紹到v-bind屬性綁定，它是一種單向的資料流綁定，而今天的內容將介紹資料的雙向綁定與修飾符。 什麼是雙向綁定？ 當表單輸入的元素會更新到 Vue 實例...
前幾天的內容都是使用Options API來撰寫範例程式碼，今天將更深入探討Composition API，並且透過實作簡易計數器來比較兩種寫法～ setup函數 <script setup&g...
今天要來介紹如何處理基本的事件監聽，並且搭配各種修飾符來控制事件的行為，例如阻止事件冒泡、取消預設行為、限制觸發條件等，讓事件處理變得更加靈活且強大。 事件處理 v-on 用於監聽DOM事件，並且在觸...
關閉自動傳透 若不想要讓屬性自動繼承，可以使用 inheritAttrs: false 來停用用法： <span>Fallthrough attribute: {{ $attrs }}&l...