對於基礎觀念和常用功能我們都有一定程度的概念了，最重要還是如何活用這些技術。今天的練習是購物車實作，試著先不參考網路範例…看看是否能順利寫出來吧！ ◎題外話：在...
在前面的章節當中我們應該對元件props/emits有一定掌握，不過在Vue中元件間的關係可能不只有上下層父子關係，在元件粒度切分比較細時，會有事件或參數(pr...
Checkbox 是一個常見的網頁元件，單個使用時可以表示在兩種狀態之間切換，多個一起使用時則允許使用者在這些選項中選擇一個或多個。它適合用於問卷調查、偏好設...
今天要來說的是「列表渲染」。列表在這邊表達的是「清單、多個資料」的意思，而我們可以使用它，像迴圈一樣的遍歷、渲染出多個元素～（由於這個用法和 JS 有點相似，因...
旋轉特效大解析：創造令人上癮的互動遊戲體驗 嘿！你有沒有注意過那些可愛的按鈕或圖標，在網頁上輕輕一碰就會旋轉起來，簡單卻讓人忍不住再多點幾次？其實這就是網頁...
今天我們進入「條件渲染」的章節囉～將分為兩部分講解： v-if、v-else-if、v-else v-show OK，請開始我的表演。 定義 Vu...
昨天複習了工廠函式，今天來連結到Vue滿常見的設計模式-組合式邏輯(Composable)。 Composable 是一個相對通俗的概念，通常指的是可以在多個元...
下拉選單（Select）在表單操作中非常常見。使用下拉選單可以在有限的空間內顯示大量選項，透過點擊來展開選單，使用者可以輕鬆瀏覽並選擇其中一個或多個選項。無論...
這幾天風暴式重新閱讀了好多Vue官方文件（真怕會消化不良），今天來講點比較有趣的效果吧！而且超簡單的就能實現在ToDoList上的～就是 「元素拖曳！」 ，做完...
用兔子吹泡泡動畫驚豔你的訪客，刷新等待體驗 你是否曾經因為網站載入速度太慢而感到焦慮？ 在現代網站開發中，等待通常是訪客戶最不喜歡的環節。如何讓使用者在等待...
後記 終於，今天是鐵人賽的最後一天了，在 Vue.js Plus 社群(加入社群) 各位大大的鼓勵 (推坑) 今年又成功強迫自己參賽了，主要是想著：「 用 N...
前面幾天我們重新回顧了Vue的語法結構，還有各種內建提供的指令用法。今天的重點放在 「如何把自己寫的內容」 定義成可以複用的函式，以及 「如何自訂指令」 ？讓我...
<textarea> 與 <input type="text"> 有需多相似之處，甚至大多數的特性都是共通的，例如...
嗨一大家，記得之前我們在屬性綁定章節，有講到 CSS 樣式可以使用 v-bind 屬性綁定樣式嗎～ 但官方文件後來卻提到了： 但是，在處理比較複雜的綁定時，通...
讓你的計時器不再無聊！帶你實現進度條的互動視覺化 你是否曾經想過，讓時間不只是冷冰冰的數字，而是變成一個動態、直觀、充滿視覺衝擊的體驗？ 今天，我們要用 V...
上次介紹插槽時有看到v-for渲染的案例，v-for是Vue官方提供的列表渲染(List rendering)指令之一，可以用來遍歷陣列或對象，在模板中生成一组...
Vue語法統整來到了最後一篇章，今天要來探索更複雜的資料處理是要如何做到？除了介紹到computed計算屬性，也要來了解watch的使用時機！那麼，就讓我們直接...
嗨一大家，記得之前我們在屬性綁定章節，有講到 CSS 樣式可以使用 v-bind 屬性綁定樣式嗎～ 但官方文件後來卻提到了： 但是，在處理比較複雜的綁定時，通...
<input> 作為表單控制元素，是網頁開發中最常見的元素之一。<input> 的不同 type 設定會影響顯示的 UI，以及它所代表...
3D 翻轉卡片特效來襲，用 Vue.js 掌控全場，玩轉視覺與互動的完美結合！ 嘿～準備好見證魔法般的 3D 翻轉效果了嗎？今天，我們要用 Vue.js 玩...
昨天重新回顧了我們在練習作品中常用的Vue語法及語法組成架構，今天再來接續介紹：還有哪些在我們這次改版練習ToDoList中遇到的常用屬性？ 本系列任務：改寫過...
我們接續響應式基礎的系列～今天帶大家看 computed 這個語法。 使用情境 computed？「計算」的意思。 那又是在計算什麼東西，為什麼 Vue 會有特...
在昨天寫完文章時，更加認識了Vue的slot插槽和當初不太理解的slot props用法，後來翻了一下Vue的設計模式(Vue Pattern)文章，有提到無渲...
運用漸變、動畫與動態樣式，讓你的網頁元素閃耀出迷人的色彩魅力！ 哈囉！受夠了中規中矩的文字了嗎？是時候讓你的網頁閃耀起來啦！ 今天我們要用 Vue.js 來玩...
記得我們在 ref 的篇章有講過「解包」嗎？官方文件在帶過 reactive 後，又細講了它倆解包的細節⋯⋯小菜菜在學習這邊的時候遇到了幾個蠻有趣的狀況坑，來跟...
還記得我們開賽第五天就在寫ToDoList了，結果現在連基本的指令都還沒完整講解（天啊），簡直像剛拿到新的空氣清淨機連內封膜都還沒撕就開始使用了！畢竟實戰演練總...
前兩篇對我們大概知道元件可以接受 props，而 props 通常是 JavaScript 資料型別(物件或一般型別)。 但在某些情況下，我們可能會希望將一段模...
讓畫面隨時光流動，用動效打造日與夜的邂逅！ 哈囉大家！今天我們要來點浪漫的～🌙☀️當我們說到網頁動效，你是不是也曾幻想過，能不能讓畫面隨著時間的流動變換出日...
在我們剛開始踏入Vue的世界是透過Node.js來安裝最新版本的Vue專案，其底層建構器就是Vite負責。但網路很多資源都還是應用Vue CLI寫出來的範本，究...
引言 在這個為期30天的前端開發之旅中，我們探索了許多先進的技術和最佳實踐。今天，我們將把目光投向更廣闊的視野，討論前端工程師應具備的素養和思維，並特別關注台...
ivytien
Rafael
Alex Liu
++
Sunny.Cat
Opshell
MichaelHo
iThome鐵人賽
看影片追技術