在開發(fā)的過程中,在模擬器上表現(xiàn)得好好的,在真機(jī)上卻出問題的例子數(shù)不勝數(shù)。譬如動(dòng)畫的使用,cover-view上面使用定位,在模擬器好好的,在真機(jī)卻錯(cuò)亂等等等等。
造成這些錯(cuò)亂主要是pc端和移動(dòng)端不同的內(nèi)核導(dǎo)致的。
避坑方式:
開發(fā)過程中,要時(shí)不時(shí)地用真機(jī)也看一下效果。
平時(shí)我們寫頁面,精彩會(huì)用一個(gè)標(biāo)簽,然后把圖片寫到該標(biāo)簽里面,直接引用,譬如下面這個(gè)例子:
<view class="icon"></view>
.icon{
color: #1d1d1d;
background-image: url(../image/doll_user_bg.png);
width:50rpx;
height:50rpx;
}
一眼看過去感覺沒毛病,但是事實(shí)上你在模擬器或者真機(jī)上會(huì)發(fā)現(xiàn),圖片出不來。原因出在了相對路徑的引用上。
避坑的方法:
(1)直接在標(biāo)簽的屬性上添加圖片的路徑
<view class='icon' style="background-image: url('../image/doll_user_bg.png');"></view>
(2)使用絕對路徑
.icon{
color: #1d1d1d;
background-image: url(https://webtest.yystatic.com/project/yyDoll/mobile/image/doll_user_bg.png);
width:50rpx;
height:50rpx;
}
(3)直接使用image標(biāo)簽代替view標(biāo)簽
<image src='../image/doll_user_bg.png'></image>
由于小程序里面video標(biāo)簽的層級是最高的無法覆蓋。所以cvoer-view應(yīng)運(yùn)而生。它就是用于蓋在video標(biāo)簽上面,進(jìn)行對video標(biāo)簽的周遭加以裝飾的利器。
然而,當(dāng)我滿心歡喜地以為這個(gè)標(biāo)簽很好用的時(shí)候,我遇到了很多奇奇怪怪的坑。
例如在cover-view上面使用相對定位,當(dāng)video標(biāo)簽大小發(fā)生變化的時(shí)候,cover-view上面的元素就亂七八糟。 又譬如圓角的不起效等等。 具體的問題大家可以在開發(fā)者社區(qū)看看。 developers.weixin.qq.com/search?acti…
避坑方法:盡量在cover-view上不使用定位,其他的bug只能等官方優(yōu)化,大家謹(jǐn)慎使用。
如果只是一般的授權(quán)登錄還是挺簡單的,但是如果你要把你公司的賬號體系和微信互聯(lián)起來,這個(gè)流程就不簡單了。
我說一下我這邊的流程是怎樣的,首先我要向公司申請賬號互聯(lián)的appid,然后要經(jīng)過多個(gè)部門的捆綁和審核,然后在公司開發(fā)者賬號下綁定小程序appid。然后等賬號那邊的同事把賬號打通,然后才實(shí)現(xiàn)了賬號互聯(lián)的授權(quán)登錄。
不同公司可能流程不大一樣,寫在這里只是作為步驟的記錄,免得以后再踩坑。
當(dāng)你在cover-view上面要是實(shí)現(xiàn)圖文混排的文字圍繞時(shí),你會(huì)發(fā)現(xiàn)平時(shí)的一些方法都失效了。
<cover-view><cover-image src="img.gif" />文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞文字環(huán)繞</cover-view>
最常用的圖片浮動(dòng),沒有效果。使用定位,使用縮進(jìn),使用css3的屬性等等,弄出來的效果放到真機(jī)上都無法正常顯示圖文混排的文字圍繞。 目前暫時(shí)沒有找到解決方法,有試過在cover-view實(shí)現(xiàn)的童鞋,求代碼。
剛開始看到小程序能內(nèi)嵌webview的時(shí)候,內(nèi)心是十分激動(dòng)的。因?yàn)橐恍┯眯〕绦螂y以實(shí)現(xiàn)或者一些需要經(jīng)常動(dòng)態(tài)更改的頁面,可以通過webview內(nèi)嵌達(dá)到自己想要的效果。但是當(dāng)我使用后,我發(fā)現(xiàn)坑爹了。webview和小程序竟然沒有比較完善的通訊機(jī)制。 小程序和webview的通訊,例如一些參數(shù)的傳遞,目前僅僅是支持url的參數(shù)傳遞。例如:
<web-view src="https://mp.weixin.qq.com?password=12212&name=sasa&ticket=215328736dsadaadasdadaswuqsahkshakskahskahsakhsakshkasha327428749827487284729847382dsakhdlahdlahskjhdlkhlkadhldkhal"></web-view>
如果你內(nèi)嵌的webview頁面是需要登錄態(tài)的,你只能在url上面把那些賬號密碼,ticket什么的全傳到參數(shù)上。很那個(gè)對不對。我在想如果有一天我要把一個(gè)復(fù)雜的form表單數(shù)據(jù)傳過去那種酸爽。希望微信的童鞋能把通訊機(jī)制完善起來。
input組件的寬度使用百分比,設(shè)置placeholder的文本text-align:canter,這時(shí)文字并不會(huì)正常居中。
原來input設(shè)置百分比, placeholder就不支持設(shè)置 text-align樣式了,想實(shí)現(xiàn)居中,就只能把input的長度寫死。
如果用戶在你小程序進(jìn)行了某些操作,例如支付或者消耗了你們的虛擬的產(chǎn)品時(shí),你可能需要發(fā)消息告訴用戶提醒用戶或者告知用戶。這個(gè)時(shí)候就需要使用到模板消息了。
當(dāng)你想下發(fā)消息的時(shí)候你會(huì)發(fā)現(xiàn),只有2種情況下你才能下發(fā)消息。
1.支付
當(dāng)用戶在小程序內(nèi)完成過支付行為,可允許開發(fā)者向用戶在7天內(nèi)推送有限條數(shù)的模板消息(1次支付可下發(fā)3條,多次支付下發(fā)條數(shù)獨(dú)立,互相不影響)
2.提交表單
當(dāng)用戶在小程序內(nèi)發(fā)生過提交表單行為且該表單聲明為要發(fā)模板消息的,開發(fā)者需要向用戶提供服務(wù)時(shí),可允許開發(fā)者向用戶在7天內(nèi)推送有限條數(shù)的模板消息(1次提交表單可下發(fā)1條,多次提交下發(fā)條數(shù)獨(dú)立,相互不影響)
++注:目前只有這2種情況才能下發(fā)消息,而且是有條數(shù)限制的,謹(jǐn)記了++。
在開發(fā)小程序的時(shí)候,還會(huì)偶發(fā)一些小bug,舉例一下:
1.longpress 有時(shí)有效,有時(shí)候失靈
2.canvas的drawImage頻繁調(diào)動(dòng)會(huì)導(dǎo)致頁面卡頓,卡...卡...頓....
3.getUserInfo的方法有時(shí)候會(huì)獲取不到用戶信息,建議可以使用輪詢,獲取到信息后再停止
4.小程序如果想使用一些特殊字體,可以先把字體轉(zhuǎn)成base64,再引入使用
5.如果想做直播相關(guān)的需求,不要使用video標(biāo)簽,請使用live-player,可以做到更好的低時(shí)延
下一篇:偷偷用!朋友圈集贊神器