iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
自我挑戰組

Vue.js 從零開始 系列

希望寫出初學者能看懂的文章,寫的過程中一邊複習Vue.js的觀念語法,讓自己能有新的理解,熟悉整個脈絡。學習的小建議,看完網路的文章或教學影片後,理解成自己的知識後,再輸出成筆記,最好能動手操作一邊,讓自己能更有印象喔,一起加油吧!

鐵人鍊成 | 共 30 篇文章 | 7 人訂閱 訂閱系列文 RSS系列文
DAY 11

Vue.js 從零開始:v-model

表單類型是網頁很常見的呈現方式,表單元素有文字框<input>、<textarea>、<select>...等,用v-mod...

2021-09-25 ‧ 由 magic0308 分享
DAY 12

Vue.js 從零開始:v-on

本篇來介紹 v-on 指令的特別之處,使用 JavaScript 撰寫一個事件處理,除了 DOM 的綁定還需要撰寫監聽事件,這邊只要加上 v-on , Vue....

2021-09-26 ‧ 由 magic0308 分享
DAY 13

Vue.js 從零開始:v-if,v-show

條件判斷 v-if v-show v-if 與 v-show 的區別 <div id="app"> <input ty...

2021-09-27 ‧ 由 magic0308 分享
DAY 14

Vue.js 從零開始:v-for

v-for 列表渲染 透過v-for指令,將資料裡的陣列或是物件重複渲染在畫面上。 遍歷物件資料: <div id="app">...

2021-09-28 ‧ 由 magic0308 分享
DAY 15

Vue.js 從零開始:methods

methods 方法 在Vue裡面methods是以物件來定義,內層都是函式,以下幾種來示範methods的觸發方式: 使用事件觸發: <div id='...

2021-09-29 ‧ 由 magic0308 分享
DAY 16

Vue.js 從零開始:computed

此篇後面會有點難懂,可以去看我的範例,更了解實際運作喔,各位加油! computed 計算屬性 computed大部分都是讀取data資料經過運算後,在渲染到畫...

2021-09-30 ‧ 由 magic0308 分享
DAY 17

Vue.js 從零開始:watch

watch監聽器 監聽data裡面的值,當值有變化時,就會觸發事件。 watch監聽一個變數: <div id="app">...

2021-10-01 ‧ 由 magic0308 分享
DAY 18

Vue.js 從零開始:生命週期

生命週期介紹 在一開始建立Vue的實體,然後掛載到#app就算是已經在使用元件,而這一連串的建立到被銷毀,都有他的生命週期。 Vue本身就是以很多元件所組成的...

2021-10-02 ‧ 由 magic0308 分享
DAY 19

Vue.js 從零開始:元件

Vue 元件概念 Component元件,作為SPA的靈魂功能,可以將程式碼以及模組封裝起來,增加程式碼的可複用性,能避免單一檔案過大,例如程式碼過多超過兩百...

2021-10-03 ‧ 由 magic0308 分享
DAY 20

Vue.js 從零開始:props 元件的溝通

上篇component元件有說到每個元件範圍都應該是獨立的,更不應該發生子元件直接改變根元件的情況,元件與元件又該怎麼正確傳遞資料呢? Props起手式 子元...

2021-10-04 ‧ 由 magic0308 分享