最近的弄的小程序差不多有點(diǎn)東西了，就來寫一些關(guān)于小程序的感悟吧

 

01 前言

一般來說，我認(rèn)為小程序是一個沒有什么技術(shù)含量的東西，特別是現(xiàn)在有了組件庫，而且小程序生態(tài)不斷完善的情況下，只要對著文檔慢慢寫就好，就是時間的問題。然后這里也不是教大家怎么去寫程序之類的，而是本人在經(jīng)歷過后的一些小建議。

02 技術(shù)選型

其實我覺得技術(shù)選型是非常重要的，直接關(guān)系到你后來的工作復(fù)雜度。怎么說呢？因為小程序的開發(fā)就是一個注重業(yè)務(wù)邏輯的過程，它與算法研究類的研發(fā)工作不同。小程序的質(zhì)量高不高，用戶體驗好不好完全取決于你的頁面設(shè)計，頁面的交互。

所以我覺得在選型的過程中有幾個特別值得注意的：

• 組件庫支持
• 框架生態(tài)
• 框架語法

基本上就是這些，首先來說一下第一個關(guān)于組件庫的支持。

組件庫支持

可以說組件就是整個程序的重要部分，因為假如你 自己寫的話肯定會花費(fèi)大量的時間 ，即使你已經(jīng)寫出來了可能也就是自己能用，兼容性也會有問題。所以關(guān)于組件的開發(fā)就 不推薦自己造輪子 了，我們還沒有這樣的時間和精力。

但是我們也不能隨便去選擇一個組件庫，我們必須要 根據(jù)小程序的頁面設(shè)計 ，詳細(xì)列出里面所有的元素到底是采用何種方法/組件實現(xiàn)的，你 選擇的組件庫是否所有都滿足 。還有一個重要的是，組件庫的 社區(qū)反饋 如何，有沒有很多不可避免的BUG在里面。

這一點(diǎn)自己也深有體會，因為組件的兼容性問題，自己往往會花費(fèi)幾天時間來做 兼容和適配 ?，F(xiàn)在我是選擇了 mpvue+vant 的形式來寫的。設(shè)計圖上面的navbar是自定義而且是固定頂部的，一開始也沒有怎么注意，覺得沒有問題。但是，在我切換不同的機(jī)型的時候問題就出來了，各種對不齊的情況接踵而來，特別是蘋果系列的機(jī)型（劉海屏）。

起初我想過自己去適配一下，但是發(fā)現(xiàn)頭發(fā)一直掉，應(yīng)該在提醒我不能這么搞了。后面就在github找到了一個可以適配的navbar組件，解決了我的問題。也從側(cè)面說明不能自己造輪子。

 

框架生態(tài)

因為最終還是要編譯成官方的小程序格式，難免會有一些問題。所以我們選擇一個小程序框架的時候也要考慮到這個問題，看 它與官方的區(qū)別 在哪，有哪一些是不支持的，看一下 社區(qū)對它的評價如何 。

基本上我們 選擇一些用戶反饋比較積極 的就好， 不要選一些新興的框架 ，因為往往也是坑比較多，而且你有時候發(fā)郵件問他們幾個世紀(jì)都不回你的。如何選擇一個比較好的框架呢？可以看文章的最后github倉庫，里面有很多關(guān)于小程序的資料，也有一些框架的排名和組件庫選擇。

框架語法

語法部分還不是最主要的，因為 前端的語法 都一樣，那我說這個的目的其實是說小程序的開發(fā)語法與官方的語法有 哪些不兼容 的，要注意一下，一般文檔都會給出來的。

目前小程序的開發(fā)都可以使用vue語法來編寫，可以說是非常方便了，但是如果你不熟悉 小程序的生命周期 與 vue的生命周期就 可能會有一些問題。我遇到的問題就是怎么合理使用生命周期函數(shù)。有時候你的程序可能會報一些奇怪的錯誤， 比如提示圖片加載失敗，然后圖片又顯示正常 。其實這就是頁面渲染的時候還沒有識別到圖片的原因，是后面加載的，這就是先后的問題。

03 開發(fā)步驟

前期就是一些架構(gòu)設(shè)計以及技術(shù)選型的內(nèi)容，前期的選擇尤為重要，技術(shù)選型好，后面你會節(jié)省很多時間和工作量。

代碼結(jié)構(gòu)設(shè)計

開發(fā)步驟也要設(shè)計，你要規(guī)劃一些目錄結(jié)構(gòu)，比如存放 組件的 、 圖片的 、 工具類函數(shù)的 、 頁面類 的等。雖然說我們的初始化項目都會有相應(yīng)的目前結(jié)構(gòu)，但是你也要在它的基礎(chǔ)上進(jìn)行稍微的改造。讓我們的目前更加清晰。

一般來說我們就從我提到的 組件 、 圖片 、 工具 、 頁面 幾個步驟出發(fā)。頁面部分我們基本上不用怎么改，因為項目初始化都幫你設(shè)計好了。組件部分我們就新建一個組件文件夾，用于存放我們的自定義組件，方便后期的復(fù)用。值得注意的是，我們一定要 寫好組件 ，讓我們的 復(fù)用效率更高 ，可以通過 傳參的形式來控制組件的形態(tài) 。

關(guān)于圖片的存儲我的建議就是可以 從功能上來劃分 ，比如tabbar的圖片，navbar的圖片，其他的圖片也是按照自己的功能來進(jìn)行劃分，這樣就顯得 邏輯結(jié)構(gòu)清晰 ，后續(xù)的 維護(hù) 更加方便容易。

項目的配置

這一方面的話看你的 具體業(yè)務(wù)需求 怎么樣，一般來說我們經(jīng)常都會調(diào)用 第三方庫函數(shù)/接口 ，如定位等?，F(xiàn)在我做的這一個就用到了騰訊地圖的第三方接口，這里就不再詳細(xì)展開。

我做的時候會出現(xiàn)域名不合法的情況，你需要在 小程序后臺進(jìn)行域名的配置 ，報錯信息都告訴你怎么配置了，把那個域名加上去就好。又或者你的后臺請求接口有錯誤的話一般就是你的接口 域名不是https協(xié)議 ，這就有點(diǎn)麻煩了，調(diào)試階段可以在開發(fā)者工具的右上角詳情部分， 勾上不檢驗 就好。

但是如果你要上線的話就需要有https的服務(wù)器放置你的接口了。

04、小結(jié)

好了，以上就是就本次項目的相關(guān)總結(jié)，但是項目本身還是沒有完善的，我也是在早期的設(shè)計上面下了一些功夫，主要還是讓自己在后面的開發(fā)過程中少一些BUG和錯誤，方便自己后期的維護(hù)。

其實業(yè)務(wù)類的小程序更要主要組件的開發(fā)和設(shè)計，因為很多頁面都會公用一個組件，假如你是復(fù)制粘貼那也未嘗不可，只是維護(hù)比較難而已。我們做每一個產(chǎn)品，在必不得已的情況下才會使用一些技巧性的東西，一般來說都會做成一個可伸縮、可維護(hù)的產(chǎn)品，也是對自己的要求。