微信小程序半周開發(fā)問題總結(jié)
|
作者：Yitim，來自原文地址
新產(chǎn)品要做一個微信小程序，不想吐槽老板沒給任何準(zhǔn)備就給出了需求和原型圖，好像默認(rèn)小程序閉著眼睛就可以很順利開發(fā)好?，F(xiàn)在半周下來（五一結(jié)束開始到今天）完成了差不多所有的界面，網(wǎng)絡(luò)請求部分還跟服務(wù)端兄弟耗著:) 。總結(jié)下來小程序的開發(fā)速度肯定不會慢，門檻不高，缺點(diǎn)則在于限制非常多，并且其本質(zhì)終究是換了毛皮的web開發(fā)，或多或少存在很多web app的通病，即使微信幫助提供了很多原生支持，這還是犧牲了很多開發(fā)自由度換來的。寫本文的目的不在小程序開發(fā)的學(xué)習(xí)上，畢竟筆者一直都只聽聞小程序大名，使用起來不過三四日，心得與教學(xué)談不上，坑多少是踩了一些，下面主要還是列出目前遇到的一些問題點(diǎn)和吐槽。 1. 資源路徑 之前出現(xiàn)過 開發(fā)工具中在wxss內(nèi)定義元素的背景圖background-image使用url('')路徑時只能使用相對路徑否則會找不到資源，但其實(shí)只有使用絕對路徑'/'開頭才能正確在手機(jī)上顯示。 在頁面的腳本中引入其他js腳本時只能使用相對路徑。 2. 富文本需求 業(yè)務(wù)需要使用富文本的，目前找不到完美使用富文本的辦法，只好改用截圖來呈現(xiàn)。 3. 樣式編輯 每個頁面都有自己的wxss，用來編輯本頁的樣式，其中<page>相當(dāng)于<body>，每個頁面的底色以及底層尺寸都哦定義到page{}里就好。 并且目前用的尺寸單位都是rpx，這尺寸有點(diǎn)小，750rpx才等于iphone6的屏幕寬度。 view是個比較通用的標(biāo)簽，拿來代替div。
4. swiper組件
5. 界面的事件交互 wxml里不能通過數(shù)據(jù)綁定來觸發(fā)函數(shù)了，那界面要如何與腳本交互呢。微信給出的方案是通過其提供的很多個事件，包括bindtap，bindchange這些東西，這些事件節(jié)點(diǎn)傳入自己定義的函數(shù)，在腳本中再從自帶的event參數(shù)中獲取本次事件觸發(fā)的一系列參數(shù)。尷尬的事情就是不能很自由的綁定參數(shù)，全都得通過event參數(shù)來獲取。比如界面上有一個節(jié)點(diǎn):
綁定了makeOrder函數(shù)后并不能直接傳入?yún)?shù)，只能在腳本中定義makeOrder函數(shù)時在其自帶的參數(shù)中獲取數(shù)據(jù)，獲取的辦法就是在節(jié)點(diǎn)上多加一個data-前綴的屬性，此屬性會被視為參數(shù)傳遞給這個事件回調(diào)。就像下圖這樣：
讓我感覺自己在寫jQuery。
6. scroll-view組件 至今沒看懂真實(shí)完美用法。
只能感受到垂直方向的滑動，通過scroll-x或scroll-y節(jié)點(diǎn)決定是橫向滾動還是縱向滾動，但目前的真實(shí)效果是scroll-x下并不能橫向滾動，下級的每個view同時只會顯示一個，并可以更改scroll-into-view節(jié)點(diǎn)來滾動到指定id的下級view中，這種場景下還算完美實(shí)用，相當(dāng)于不支持手勢滑動的縱向swiper。
7. 數(shù)據(jù)綁定
8. 消息提示API 目前的消息提示框類型就只有一種，即使圖標(biāo)可以自定義，好歹把模擬安卓原生的Toast給提供了嘛。 |
