【Vue.js 學習筆記】00. 目錄 نُشر في 2020-08-25 عُدل في 2020-09-06 في Framework 前言在六角學院購買了《Vue 出一個電商網站》課程,針對這門課程做讀書筆記。 01. 相關資源與工具設置 Vue 官方文件 開發工具 網頁除錯工具 02. 基礎 Vue 概述 應用程式建立 雙向綁定的資料 與 MVVM 的概念 v-bind 動態屬性指令 v-for 動態產生多筆資料於畫面上 使用 v-on 來操作頁面行為 預先定義資料狀態的重要性 透過修飾符,讓 v-on 操作更簡單 :class 動態切換 className computed 運算功能 Vue 表單與資料的綁定 元件基礎概念 練習測驗 1:基礎章節測驗 03. 製作一個 Todo List 來小試身手吧 套用版型及建立代辦事項列表的資料 刪除陣列上的特定資料 製作頁籤分類的功能 雙擊修改資料內容 刪除項目補充說明 04. 進階模板語法介紹 模板資料細節說明 動態切換 ClassName 及 Style 多種方法 v-for 與其使用細節 v-if 與其使用細節 Computed 與 Watch 表單細節操作 v-on 的頁面操作細節 章節作業 05. Vue 的生命週期 Vue 生命週期 練習測驗 2:生命週期章節小測驗 06. Vue.js 元件 元件概念介紹 使用 x-template 建立元件 使用 function return 建構資料格式 props 基本觀念 props 使用上的注意事項 props 型別及預設值 emit 向外層傳遞事件 Slot 元件插槽 使用 is 動態切換元件 元件 章節作業 測驗:Vue 元件測驗 07. JavaScript ES6 使用 let 與 const 宣告變數 展開與其餘參數 解構 縮寫 箭頭函式與傳統函式 字串模板 Template String 常用陣列方法 測驗 2: ES6 小測驗 08. Vue 常用 API 使用 Extend 避免重複造輪子 Filter 自訂畫面資料呈現格式 無法寫入的資料,用 set 搞定他 Mixin 混合其它的元件內容 使用 Directive 開發自己的互動 UI 09. Vue Cli 的建置與運作原理 為什麼要學 Vue Cli Vue Cli 2.x 與 Vue Cli 3.x 課程說明 如何使用 Vue Cli Vue Cli 所產生的資料夾結構說明 Webpack 腳本介紹 及 自定義環境變數 安裝套件在 Vue Webpack 中 10. Vue Router 使用 Vue Router 及配置路由文件 新增路由路徑及連結 製作巢狀路由頁面 使用動態路由切換頁面 Ajax 結果 命名路由,同一個路徑載入兩個頁面元件 Vue Router 參數設定 自定義切換路由方法 11. Vue 出一個電商網站 12. Vue Cli 3.0 13. Vuex 管理大型網站資料狀態 14. 線上問答會實戰內容