vuecrud鉤子 Vue2實踐揭

2021-10-16 19:31:10 字數 2356 閱讀 5931

《vue2實踐揭秘》以vue2的實踐應用為根基,從實際示例入手,詳細講解vue2的基礎理論應用及高階元件開發,通過簡明易懂的例項**,生動地讓讀者快速、全方位地掌握vue2的各種入門技巧以及一些在實際專案中的寶貴經驗。

《vue2實踐揭秘》除了全面、細緻地講述vue2的生態結構、實際程式設計技巧和一些從實踐中得到的經驗,還重點介紹如何以元件化程式設計思想為指導,以前端工程化方法為實現手段來實踐vue2,通過元件的單元測試和e2e測試來保證工程質量。

目錄第1章 例說vue.js 1

1.1 插值 5

1.2 資料繫結 6

1.3 樣式繫結 9

1.4 過濾器 12

第2章 工程化的vue.js開發 15

2.1 腳手架vue-cli 16

2.2 深入vue-cli的工程模板 19

2.2.1 webpack-******模板 19

2.2.2 webpack模板 21

2.2.3 構建工具 23

2.3 vue工程的webpack配置與基本用法 25

2.3.1 webpack的特點 26

2.3.2 基本用法 27

2.3.3 用別名取代路徑引用 29

2.3.4 配置多入口程式 30

2.4 基於karma+phantom+mocha+sinon+chai的單元測試環境 32

2.5 基於nightwatch的端到端測試環境 38

第3章 路由與頁面間導航 51

3.1 vue-router 53

3.2 路由的模式 57

3.3 路由與導航 58

3.4 導航狀態樣式 69

3.5 history的控制 70

3.6 關於fallback 71

3.7 小結 73

第4章 頁面的區塊化與元件的封裝 75

4.1 頁面邏輯的實現 76

4.2 封裝可重用元件 80

4.3 自定義事件 87

4.4 資料介面的分析與提取 89

4.5 從服務端獲取資料 91

4.6 建立複合型的模板元件 95

4.7 資料模擬 100

4.8 小結 102

4.9 擴充套件閱讀:vue元件的繼承——mixin 103

第5章 vue的測試與除錯技術 110

5.1 mocha入門 111

5.2 元件的單元測試方法 118

5.3 單元測試中的**技術 121

5.3.1 呼叫偵測(spies) 124

5.3.2 sinon的斷言擴充套件 126

5.3.3 存根(stub) 128

5.3.4 介面**(mocks) 131

5.3.5 後端服務** 133

5.4 除錯 134

5.5 nightwatch入門 139

5.5.1 編寫端到端測試 139

5.5.2 鉤子函式與非同步測試 141

5.5.3 全域性模組與nightwatch的除錯 143

5.5.4 page objects模式 147

第6章 檢視與表單的處理 153

6.1 為vue2整合uikit 154

6.2 **檢視的實現 159

6.2.1 實時資料篩選 164

6.2.2 多行資料的選擇 167

6.2.3 排序的實現 171

6.3 單一職責原則與高階元件開發方法 176

6.3.1 搜尋區的元件化 177

6.3.2 母板元件 179

6.3.3 重構模態對話方塊元件 181

6.3.4 高階元件與render方法 183

6.3.5 uikit按鈕 194

6.3.6 通用**元件 198

6.4 表單的設計與實現 211

6.4.1 計算屬性的雙向繫結 214

6.4.2 富文字編輯器元件的實現 215

6.4.3 實現巢狀式容器元件 220

6.4.4 表單的驗證 224

6.5 整合服務端的crud restful api 239

6.7 開發伺服器的定製 245

第7章 vuex狀態管理 250

7.1 vuex的基本結構 253

7.2 data的替代者——state和getter 256

7.3 測試getter 260

7.4 action——操作的執行者 261

7.5 測試action 263

7.6 只用mutation修改狀態 265

7.7 測試mutations 268

7.8 子狀態和模組 269

7.9 用服務分離外部操作 274

vue2新人入門

預設對webpack,sass,npm有一定的了解。一些vue指令不會說,反正官方文件有,我也懶得抄。一 超級基礎部分 1.全域性安裝 npm install globall vue cli 已全域性安裝了的不必安裝 2.建立乙個基於webpack的模板專案 vue init webpack 你的專...

Vue2學習筆記

v cloak v text v html v bind v on click.stop click.prevent click.capture click.self click.once v model.lazy trim number 或者通過vue的watch監聽來處理watch b func...

vue2 學習筆記

2.安裝vue腳手架 用於建立vue專案的 進入專案檔案或者新建乙個檔案 npm install vue cli g 3.根據模板建立專案 vue init webpack dome 工程名稱 工程名字 工程名字不能用中文 備註 use eslint to lint your code n 是是否開...