目錄
一、常用知識(shí)點(diǎn)
二率触、開發(fā)坑
三终议、擴(kuò)展
一、常用知識(shí)點(diǎn)
1葱蝗、瀏覽器穴张、服務(wù)器、小程序之間模塊組成
（1）瀏覽器
ES两曼、DOM皂甘、BOM
（2）服務(wù)器
ES、native悼凑、npm
（3）小程序
ES偿枕、小程序框架、專用api
2户辫、小程序運(yùn)行環(huán)境
（1）開發(fā)環(huán)境
IDE——nwjs
（2）生產(chǎn)環(huán)境
android——X5內(nèi)核
ios——JSC內(nèi)核
PS：平臺(tái)不同渐夸，環(huán)境不同，兼容性也會(huì)有差異渔欢。因此墓塌，盡量多做真機(jī)測試。
3奥额、基本構(gòu)成
（1）結(jié)構(gòu)
WXML
（2）樣式
WXSS
（3）數(shù)據(jù)邏輯
WXS苫幢、JS
4、<wxs>標(biāo)簽——將外部 / 內(nèi)部wxs代碼垫挨，打包成一個(gè)組件對(duì)象
用法
在標(biāo)簽內(nèi)加入module="xxx"韩肝，xxx為組件對(duì)象，而代碼塊暴露出來的變量九榔，將作為該對(duì)象的屬性或方法伞梯。
除了module.exports外，不要用其他ES6語法
5帚屉、在wxs代碼塊中，/*為結(jié)束注釋漾峡，后面的代碼不會(huì)執(zhí)行
6攻旦、小程序框架——MINA框架
特點(diǎn)
（1）雙線程
（2）WXML、WXSS生逸、WXS都在ui線程中運(yùn)行
（3）邏輯層通過page.setData(obj)方法牢屋，向視圖層傳遞需要更新的數(shù)據(jù)
7且预、啟動(dòng)方式
（1）冷啟動(dòng)
第一次啟動(dòng)、5分鐘后再啟動(dòng)烙无、兩次警告后再啟動(dòng)（被微信銷毀了）
（2）熱啟動(dòng)
5分鐘內(nèi)啟動(dòng)
若啟動(dòng)時(shí)锋谐，小程序有新版本，會(huì)異步加載內(nèi)容截酷，默認(rèn)下次啟動(dòng)時(shí)替換為新版本涮拗，但是可以使用某api功能，達(dá)到立即替換為新版本迂苛。
8三热、資源加載流程
特點(diǎn)
（1）本地緩存
（2）CDN內(nèi)容分發(fā)網(wǎng)絡(luò)
（3）ajax
9、生命周期事件——程序生命周期三幻、頁面生命周期
程序生命周期
（1）onLaunch：初始化完成
（2）onHide：收起小程序到后臺(tái)
（3）onShow：展開小程序到前臺(tái)（熱啟動(dòng)）
（4）onError：程序出錯(cuò)
globalData——全局?jǐn)?shù)據(jù)
頁面生命周期
（1）onLoad：頁面冷啟動(dòng)后就漾，初次加載（只有一次）
（2）onShow：每次切換頁面，在之后的頁面中觸發(fā)
（3）onReady：頁面被首次切換到（每個(gè)頁面只有一次）
（4）onHide：每次切換頁面念搬，在之前的頁面中觸發(fā)
（5）onUnload：關(guān)閉當(dāng)前頁
data——頁面數(shù)據(jù)
10抑堡、指令渲染寫法（如wx: if或者wx: for）
（1）單個(gè)渲染
直接在標(biāo)簽內(nèi)部寫
（2）多個(gè)
用block包裹，在block寫
11朗徊、wxml文件導(dǎo)入
（1）<import/>
只導(dǎo)入目標(biāo)文件中的模板首妖，而間接的模板不會(huì)導(dǎo)入
（2）<include/>
導(dǎo)入目標(biāo)文件中，除了模板的全部內(nèi)容荣倾，間接的模板也會(huì)導(dǎo)入
12悯搔、<text>支持轉(zhuǎn)義字符
13、<rich-text>
通過html舌仍、css的方式妒貌，渲染出wxml、wxss的內(nèi)容铸豁。
14灌曙、在app.json的pages數(shù)組中，寫頁面路徑的同時(shí)节芥，會(huì)在該位置自動(dòng)生成相應(yīng)系列文件在刺。
15、存儲(chǔ)數(shù)據(jù)
視圖層
dataset头镊，自定義屬性
邏輯層
data對(duì)象
16蚣驼、其他內(nèi)容
（1）project.config.json
保存環(huán)境配置，防止換電腦跑不了項(xiàng)目相艇。
（2）其他json
保存頁面配置颖杏，而app.json負(fù)責(zé)整個(gè)小程序的配置（操盤手）。
（3）js
應(yīng)用級(jí)JS坛芽、頁面級(jí)JS留储，分別具有應(yīng)用級(jí)翼抠、頁面級(jí)的生命周期事件。
（4）utils文件夾
存放共用工具類获讳，如常用的函數(shù)阴颖。
17、頁面而言丐膝，除了基本的生命周期事件外量愧，還具備豐富的交互事件，如上下拉尤误、滾動(dòng)侠畔、分享、tab切換
若不設(shè)置分享函數(shù)损晤，則右上角按鈕中软棺，菜單會(huì)沒有轉(zhuǎn)發(fā)功能。而且尤勋，分享函數(shù)可以返回一個(gè)對(duì)象喘落，為分享窗口提供自定義標(biāo)題、描述最冰，以及帶參的轉(zhuǎn)發(fā)路徑瘦棋。
18、頁面路由
概念
以棧的形式暖哨，管理頁面的歷史記錄赌朋。
注意點(diǎn)
（1）重定向：前一個(gè)頁面出棧。
（2）tab切換篇裁、重新加載：之前所有頁面出棧沛慢。
（3）進(jìn)棧onLoad，出棧onUnload达布。
（4）棧存放頁面數(shù)量团甲，不能超過5個(gè)。
19、注意回調(diào)時(shí)，this指向會(huì)產(chǎn)生變化痢掠。
解決措施
（1）私有變量保存this。
（2）ES6語法匹厘。
20、邏輯層數(shù)據(jù)
（1）this.data.xxx
只關(guān)注邏輯層脐区，數(shù)據(jù)不傳遞到視圖層愈诚。
（2）this.setData(obj)
更改邏輯層的同時(shí)，會(huì)將數(shù)據(jù)傳遞到視圖層，但是單次設(shè)置不要超過1M扰路。
21、插值表達(dá)式（雙花括號(hào)）
（1）{{ }}內(nèi)部可以放入data中的變量倔叼，也可以是任何表達(dá)式
（2）安放位置
特性值汗唱、標(biāo)簽之間。
22丈攒、列表渲染時(shí)哩罪，沒有設(shè)置key的話，會(huì)有警告巡验。若是靜態(tài)列表际插，無需強(qiáng)求，但強(qiáng)迫癥例外显设。
23框弛、模板管理
在pages文件夾下，新開一個(gè)template文件夾捕捂，存放不同類型的模板瑟枫，便于管理。
24指攒、標(biāo)簽組件
學(xué)習(xí)方法
多看文檔慷妙，對(duì)各組件的特性有大致了解。
input組件不能設(shè)置字體類型允悦。
25膝擂、頁面帶參跳轉(zhuǎn)
（1）舊頁面
在url中，拼接字符串隙弛。
（2）新頁面
onLoad()會(huì)接收一個(gè)裝載參數(shù)的對(duì)象架馋。
26、性能優(yōu)化
https://developers.weixin.qq.com/miniprogram/dev/framework/performance/tips.html
27驶鹉、事件綁定
（1）冒泡流（子到父）
bind(xxx)——冒泡
catch(xxx)——不冒泡
（2）捕獲流（父到子）
capture-bind:xxx——捕獲绩蜻，再冒泡
capture-catch:xxx——捕獲到位后，停在該位置室埋，不冒泡
28办绝、自動(dòng)預(yù)覽
開發(fā)者工具中，具備自動(dòng)預(yù)覽功能姚淆，讓手機(jī)與電腦實(shí)時(shí)通訊孕蝉，不必每次調(diào)試都要掃碼，不過一定要先保存腌逢，再進(jìn)行編譯預(yù)覽降淮。
29、真機(jī)調(diào)試
（1）與預(yù)覽相比，真機(jī)調(diào)試提供詳細(xì)的監(jiān)控信息佳鳖。
（2）某些設(shè)備不支持部分API霍殴，因此真機(jī)調(diào)試更可靠。
30系吩、WXSS不能獲取本地資源来庭，如background
31、button標(biāo)簽實(shí)現(xiàn)轉(zhuǎn)發(fā)
https://www.cnblogs.com/cisum/p/9467505.html
32穿挨、小程序?qū)崿F(xiàn)雙向綁定
https://www.cnblogs.com/sgqwjr/p/9130744.html
33月弛、地圖導(dǎo)航
https://www.cnblogs.com/silent007/p/8670091.html
（1）動(dòng)態(tài)獲取經(jīng)緯度
http://www.cnblogs.com/silent007/p/9023799.html
（2）靜態(tài)獲取經(jīng)緯度
https://lbs.qq.com/tool/getpoint/
二、開發(fā)坑
1科盛、wx.getSystemInfo()要從onReady()階段開始帽衙，才能正常運(yùn)行。
2贞绵、canvas系列
（1）ctx.drawImage()圖片路徑必須是本地的厉萝，因此先要用wx.downloadFile()將圖片下載到本地，再進(jìn)行繪制但壮。
（2）wx.canvasToTempFilePath()必須作為ctx.draw()的回調(diào)冀泻，才能正常導(dǎo)出畫布截圖路徑；而且為了防止產(chǎn)出圖片變形（還沒完全生成）蜡饵，應(yīng)該為該方法加上大于300ms的延遲弹渔。因此，基本格式為ctx.draw()——>wx.canvasToTempFilePath()——>setTimeout()溯祸。
（3）畫布尺寸單位為px肢专，想要響應(yīng)式，必須先獲取屏幕像素焦辅，通過rpx轉(zhuǎn)換公式運(yùn)算博杖，獲得單個(gè)rpx相應(yīng)的值，此時(shí)插入因數(shù)就相當(dāng)于使用rpx單位筷登。
（4）隱藏畫布的最佳方法：用絕對(duì)定位甩出屏幕剃根。
1、外層零寬高overflow: hidden藏不住畫布中的圖片
2前方、手法必須是藏狈醉，不能是消，若不讓畫布渲染惠险，則無法對(duì)畫布截圖
3苗傅、廣告
（1）注意官方規(guī)定的廣告安放位置規(guī)則
（2）廣告元素不能綁定事件等騷操作
（3）上線后，廣告需要審核班巩，可能一段時(shí)間顯示不了廣告
三渣慕、擴(kuò)展
1、獲取當(dāng)前頁url
https://www.hishop.com.cn/xiaocx/show_52692.html
2、小程序跳轉(zhuǎn)到其他小程序
https://blog.csdn.net/shaleilei/article/details/83785538
3逊桦、小程序注冊(cè)登錄眨猎，獲取用戶信息
（1）視頻
https://www.bilibili.com/video/av38342501?from=search&seid=1562815510002242871
（2）博文
https://www.cnblogs.com/cisum/p/9458692.html
https://www.cnblogs.com/HappyYawen/p/9047420.html
