一、實例生命周期
公司主營業(yè)務(wù):網(wǎng)站制作、成都做網(wǎng)站、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。成都創(chuàng)新互聯(lián)是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團隊。公司秉承以“開放、自由、嚴謹、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團隊有機會用頭腦與智慧不斷的給客戶帶來驚喜。成都創(chuàng)新互聯(lián)推出欒城免費做網(wǎng)站回饋大家。
除了Vue本身的生命周期處,mpvue還兼容了小程序的生命周期,這部分生命周期的鉤子來源于微信小程序的Page,除特殊情況外,不建議使用小程序的生命周期鉤子。
app 部分:
page 部分:
用法示例:
new Vue({ data: { a: 1 }, created () { // `this` 指向 vm 實例 console.log('a is: ' + this.a) }, onShow () { // `this` 指向 vm 實例 console.log('a is: ' + this.a, '小程序觸發(fā)的 onshow') } }) // => "a is: 1"
注意點:
二、模板語法
不支持 純-HTML
小程序里所有的 BOM/DOM 都不能用,也就是說 v-html 指令不能用。
不支持部分復雜的 JavaScript 渲染表達式
我們會把 template 中的 {{}} 雙花括號的部分,直接編碼到 wxml 文件中,由于微信小程序的能力限制(數(shù)據(jù)綁定),所以無法支持復雜的 JavaScript 表達式。
目前可以使用的有 + - * % ?: ! == === > < [] .,剩下的還待完善。
不支持過濾器
渲染部分會轉(zhuǎn)成 wxml ,wxml 不支持過濾器,所以這部分功能不支持。
不支持函數(shù)
不支持在 template 內(nèi)使用 methods 中的函數(shù)。
列表渲染
全支持 官方文檔:列表渲染
只是需要注意一點,嵌套列表渲染,必須指定不同的索引!
- {{item.value}}
事件處理器
在 input 和 textarea 中 change 事件會被轉(zhuǎn)為 blur 事件。
踩坑注意:
列表中沒有的原生事件也可以使用例如 bindregionchange 事件直接在 dom 上將bind改為@
@regionchange,同時這個事件也非常特殊,它的 event type 有 begin 和 end
兩個,導致我們無法在handleProxy 中區(qū)分到底是什么事件,所以你在監(jiān)聽此類事件的時候同時監(jiān)聽事件名和事件類型既
小程序能力所致,bind 和 catch 事件同時綁定時候,只會觸發(fā) bind ,catch 不會被觸發(fā),要避免踩坑。
事件修飾符
.stop 的使用會阻止冒泡,但是同時綁定了一個非冒泡事件,會導致該元素上的 catchEventName 失效!
.prevent 可以直接干掉,因為小程序里沒有什么默認事件,比如submit并不會跳轉(zhuǎn)頁面
.capture 支持 1.0.9
.self 沒有可以判斷的標識
.once 也不能做,因為小程序沒有 removeEventListener, 雖然可以直接在 handleProxy 中處理,但非常的不優(yōu)雅,違背了原意,暫不考慮
其他 鍵值修飾符 等在小程序中壓根沒鍵盤,所以。。。
三、組件
有且只能使用單文件組件(.vue 組件)的形式進行支持。其他的諸如:動態(tài)組件,自定義 render,和