iT邦幫忙

鐵人檔案

2017 iT 邦幫忙鐵人賽
回列表
Modern Web

Vue.js 30天 系列

參賽天數 30 天共 30 篇文章 | 61 人訂閱 訂閱系列文
DAY 1

Vue.js 01 - 前言

第一次參加鐵人賽,希望利用這30天整理筆記。 在寫 Vue.js 之前,前端專案主要使用 AngularJS,身為一個包山包海的強大框架,只要好好熟讀文件,問題...

2016-12-16 ‧ 由 Ralph 分享
DAY 2

Vue.js 02 - 結構

Vue.js 是個專注在 視圖層 (View) 的框架,幫助開發者切分前端的資料狀態和運作邏輯, 從這樣(馬鈴薯) 變成這樣(山葡萄) 不好意思,是長這樣...

2016-12-17 ‧ 由 Ralph 分享
DAY 3

Vue.js 03 - 開發環境

寫Code首先得建好環境 官方下載點提供 Development 和 Production 版本,除了壓縮外,差在是否顯示 Vue 警告和錯誤訊息。 習慣套件管...

2016-12-18 ‧ 由 Ralph 分享
DAY 4

Vue.js 04 - Vue Instance

前面介紹 Vue 的元件結構,要多少都隨你掛載,直到滿意。 但今天要多講一點 Vue Instance。 Vue app 都源於一個根節點,Vue Instan...

2016-12-19 ‧ 由 Ralph 分享
DAY 5

Vue.js 05 - 資料綁定(data binding) 與 樣板(template) 語法

為什麼要做 資料綁定 ? Vue Instance 或 Component都有各自的資料,對前端來講,空有資料是沒意義的,必須讓使用者閱讀、操作,資料綁定串起這...

2016-12-20 ‧ 由 Ralph 分享
DAY 6

Vue.js 06 - 樣板(template) 常用功能

樣式套用 綁定 Class 基本寫法以 JSON 傳入,當對應的數值為 true 時套用,false 時移除該類別 <button class=&qu...

2016-12-21 ‧ 由 Ralph 分享
DAY 7

Vue.js 07 - 樣板(template) 常用功能 - 列表

延續上一篇介紹 Template 常用寫法,這篇將說明如何顯示多筆資料。 v-for 即一般常見的 for 迴圈,用來處理 陣列 不過小菜一碟。 <ul...

2016-12-22 ‧ 由 Ralph 分享
DAY 8

Vue.js 08 - 過濾器(Filter)

這篇本來要加入 樣板(Template) 常用功能的說明文,想到要說明 1.x 到 2.x 的寫法轉變,獨立出來會比較好。 過濾器(Filter) 像濾網,用來...

2016-12-23 ‧ 由 Ralph 分享
DAY 9

Vue.js 09 - Watch

雖然前一回Cue到 計算屬性(Computed),照理說該它出場了。 但在這之前,先介紹相對好懂的 Watch。 若寫過 AngularJS,應該覺得非常親切。...

2016-12-24 ‧ 由 Ralph 分享
DAY 10

Vue.js 10 - 計算屬性(Computed)

計算屬性 具有什麼特性? 當我們定義一個 computed,其相依 data 一變,computed 也會隨之更新。 以一個會員資料頁面為例,他可能會需要不同的...

2016-12-25 ‧ 由 Ralph 分享