組件 82

4.1.2 組件 84

4.1.3 組件 85

4.1.4 組件 86

4.1.5 組件 87

4.1.6 組件 91

4.1.7

4.1.8 組件 97

4.2 內置模塊 100

4.2.1 DOM模塊 100

4.2.2 steam模塊 102

4.2.3 modal模塊 103

4.2.4 animation模塊 105

4.2.5 navigator模塊 107

4.2.6 storage模塊 108

4.3 Weex Ui詳解 110

4.3.1 Weex Ui簡介 110

4.3.2 組件 111

4.3.3 組件 113

4.3.4 組件 117

4.3.5 組件 119

4.3.6 組件 121

4.4 本章小結 123

第5章 Rax框架詳解 124

5.1 Rax簡介 124

5.2 Rax快速入門 125

5.2.1 搭建環境 125

5.2.2 基本概念 127

5.2.3 FlexBox與樣式 128

5.2.4 事件處理 129

5.2.5 網絡請求 131

5.3 Rax組件 133

5.3.1 組件 133

5.3.2 組件 134

5.3.3 組件 136

5.3.4 組件 139

5.3.5 組件 143

5.3.6 組件 146

5.3.7 組件 148

5.4 本章小結 150

第6章 Vue.js框架詳解 151

6.1 Vue.js簡介 151

6.2 Vue.js快速入門 152

6.2.1 搭建環境 152

6.2.2 Vue.js項目的目錄結構 154

6.2.3 Vue.js實例 155

6.2.4 模板 156

6.2.5 數據 157

6.2.6 方法 158

6.2.7 生命周期 159

6.3 基礎特性 162

6.3.1 數據綁定 162

6.3.2 模板渲染 163

6.3.3 事件處理 166

6.4 指令 169

6.4.1 v-bind指令 169

6.4.2 v-model指令 170

6.4.3 v-on指令 172

6.4.4 v-cloak指令 174

6.4.5 v-once指令 174

6.4.6 自定義指令 174

6.5 過濾器 178

6.5.1 過濾器注冊 178

6.5.2 自定義過濾器 178

6.5.3 過濾器串聯 179

6.6 Vue.js組件 180

6.6.1 組件基礎 180

6.6.2 組件擴展 181

6.6.3 組件注冊 181

6.6.4 組件選項 183

6.6.5 組件通信 185

6.6.6 動態組件 187

6.6.7 緩存組件 188

6.6.8 異步組件 189

6.7 vue -router 191

6.7.1 安裝與配置 191

6.7.2 基本用法 192

6.7.3 路由匹配 193

6.7.4 嵌套路由 194

6.7.5 命名路由 196

6.7.6 路由對像 197

6.7.7 路由屬性與方法 197

6.7.8 路由傳參 199

6.8 本章小結 200

第7章 BindingX框架 201

7.1 BindingX簡介 201

7.1.1 基本概念 201

7.1.2 背景 202

7.2 BindingX框架快速上手 203

7.2.1 快速入門 203

7.2.2 手勢 204

7.2.3 動畫 208

7.2.4 滾動 211

7.2.5 陀螺儀 213

7.3 API 215

7.3.1 事件類型 215

7.3.2 表達式 217

7.3.3 目標屬性 217

7.3.4 插值器 218

7.3.5 顏色函數 218

7.4 本章小結 219

第8章 WEEX Eros App開發實戰 220

8.1 WEEX Eros簡介 220

8.2 快速入門 220

8.2.1 搭建環境 221

8.2.2 創建工程 221

8.2.3 運行項目 222

8.2.4 Eros示例 225

8.2.5 工程配置 227

8.2.6 開發調試 231

8.2.7 增量發布 232

8.3 組件 232

8.3.1 globalEvent 232

8.3.2 Axios 233

8.3.3 Router 236

8.3.4 storage 239

8.3.5 event 242

8.3.6 image 244

8.3.7 notice 245

8.3.8 自定義組件 247

8.4 模塊 248

8.4.1 模塊概念 248

8.4.2 bmEvents 249

8.4.3 bmWebSocket 250

8.4.4 bmBundleUpdate 253

8.5 開發配置 253

8.5.1 Android原生配置 254

8.5.2 Android打包配置 255

8.5.3 iOS原生配置 257

8.5.4 iOS打包配置 258

8.6 插件 260

8.6.1 Android插件化 260

8.6.2 iOS插件化 261

8.6.3 基礎插件 265

8.6.4 微信插件 266

8.6.5 高德插件 269

8.7 熱更新 272

8.7.1 熱更新原理 272

8.7.2 熱更新配置 273

8.7.3 熱更新實戰 275

8.8 本章小結 278

第9章 移動電商應用開發實戰 279

9.1 項目概述 279

9.2 搭建項目 279

9.2.1 新建項目 279

9.2.2 編寫主框架 280

9.2.3 Iconfont 283

9.2.4 自定義選項卡組件 286

9.2.5 路由配置 288

9.2.6 數據請求 289

9.3 功能編寫 290

9.3.1 首頁開發 290

9.3.2 廣告彈窗開發 292

9.3.3 商品詳情頁開發 294

9.3.4 訂單管理頁開發 296

9.3.5 適配iPhone X 299

9.4 打包與上線 302

9.4.1 更換默認配置 302

9.4.2 iOS打包 303

9.4.3 Android打包 305

9.5 本章小結 307

近年來，伴隨著大前端概念的提出和興起，移動端和前端的邊界變得越來越模糊，一大批移動跨平臺開發框架和模式湧現出來。從早期的PhoneGap、Inoic 等Hybrid技術，到現在耳熟能詳的React Native、WEEX和Flutter等跨平臺技術，無不體現著移動端開發的前端化。

作為阿裡巴巴開源的一套移動跨平臺技術框架，WEEX框架最初是為了解決移動開發過程中頻繁發版和多端研發的問題而開發的。具體來說，使用WEEX提供的跨平臺開發技術，開發者可以很方便地使用Web前端技術來構建高性能、可擴展的原生性能體驗，並支持在Android、iOS和Web等多平臺上進行部署。

作為目前主流的跨平臺技術框架之一，WEEX項目使用Vue.js進行編寫，對於熟悉Web前端開發的開發者來說，其是一個不錯的選擇。在性能和項目迭代方面，WEEX與PhoneGap、Inoic等Hybrid技術相比也有一定的優勢。

不過由於種種原因，WEEX的社區生態並不是很完善，也沒有一本繫統介紹WEEX的書籍。基於對跨平臺技術的熱愛，以及積累的一些WEEX項目實戰經驗，筆者思量再三決定對WEEX框架進行繫統的梳理，並將其整理成書。

“路漫漫其修遠兮，吾將上下而求索。”通過對WEEX技術的學習和本書的寫作，筆者深刻地意識到“學無止境”的含義。如果本書對你學習WEEX有所幫助和啟發，筆者將不勝欣慰。

如何閱讀本書

本書共分為9章，章節概要如下。

第1章～第4章：這4章屬於WEEX入門與基礎部分。這部分內容主要包括WEEX簡介、WEEX環境搭建、WEEX基礎知識以及WEEX開發常用的組件和模塊等內容。同時，本部分內容配備了大量的實例，通過這部分內容的學習，讀者將會對WEEX有一個基本的認識。

第5章～第8章：這4章屬於WEEX進階部分。這部分內容主要由講述Rax、Vue.js、BindingX和WEEX Eros的章節組成，主要是介紹WEEX開發中的一些進階知識。同時，為了加快WEEX的開發效率，建議開發者直接使用WEEX Eros和weexplus等WEEX腳手架。

第9章：這一章屬於WEEX項目實戰部分。這部分講述了WEEX項目實戰的內容，是對WEEX基礎知識的綜合運用。通過此部分的知識講解，讀者將會對WEEX有一個全面的認識。

希望通過本書的講解，讀者可以對WEEX技術有一個全面的了解，並能夠使用它進行移動跨平臺項目的開發。

適讀人群

本書是一本關於WEEX入門與實戰的書籍，適合前端開發者和移動Android/iOS開發者閱讀。因此，不管你是一線移動開發工程師，還是有志於從事移動開發的前端開發者，都可以通過學習本書來獲取移動跨平臺開發的技能。