微信小程式入門學習筆記

weixin_34007291發表於2018-05-11
12035837-524e3d02b2e93370.png
強烈推薦連勝老師的微信小程式開發的學習課程:https://www.imooc.com/learn/974

        這是聽連勝老師的入門微信小程式開發課程所記的筆記,總結很粗糙,望諒解,有興趣小夥伴配合老師課程聽,這個只是為了節省大家記筆記的時間。

12035837-14174d847104e375.png
12035837-393b5bafc21389b8.png
12035837-91c90f65ad0a7aa5.png
12035837-2a96693752610d1e.png
程式碼實現:目標圖如下
12035837-391d35a2ea7bd2c6.png
開始:
12035837-af354f513ab7af1b.png
12035837-d04825d0fe756e86.png
輪播實現:
12035837-f5aaa07e566d5cc6.png
12035837-c1066764bdb96130.png
12035837-254c6ab73e8305b3.png
12035837-1ece5f32d1820514.png
12035837-8dc5447ed27d4279.png
使得輪播圖下面有更換圖片的點 知道是第幾張圖片:
12035837-322c76e249082e4c.png
繼續:
12035837-e03ba74e6d351b88.png
修改樣式:
12035837-82016e98f949a30f.png
12035837-c418eeb4d8a19727.png
12035837-b1ce82fb8ff6e091.png
12035837-421b1fa8532b66ea.png
12035837-ec4da214f9aec1eb.png
index.js程式碼:
12035837-57561f698ccf37f9.png
只有標籤才支援/n換行處理
12035837-cf792b8505451b54.png
wxml的事件:下拉提示選單都是繫結的事件 可參照學習:
12035837-5b4337c67ab6b995.png
12035837-6d48d50853df762b.png
12035837-1d6fa341826ed8c8.png
12035837-8d61294509ddab81.png
12035837-0c7a19c773155d5b.png
加入頁面模組的編寫:目標圖如下:
12035837-a9566fd5dd953e2b.png
1:
12035837-7989cc6f30d12012.png
:2:
12035837-12ec2559aeb42f6d.png
12035837-44167f0eb094fbae.png
實現電話諮詢:目標圖如下:
12035837-cf4601f8364f19e0.png
實現電話諮詢--呼叫介面
12035837-d72e0f52ec53d6c2.png
12035837-46e2d9611425fb8f.png
12035837-39daa1e6eeb114b6.png
12035837-1a118eede36d62d1.png
三:關於API請求:勾選最後一項
12035837-b4f8c1934f040430.png
從服務端返回資料:
12035837-4e4809dea1657cdb.png
列印出的變數:
12035837-c56f38905742cbd7.png
12035837-5f971b505c007a47.png
12035837-40ad30affee1e00e.png
二:關於基礎庫相容:
12035837-eebbfe7b606aa1c2.png
呼叫微信的api實現複製內容功能:
12035837-e1e738177586cd66.png
12035837-5de9d58623fb0d96.png
在js中寫copy方法:
12035837-f5726a0a76dcd66b.png
12035837-c147159c18358fc5.png
切換到低版本1.0時,該複製功能實現不了:切換版本:
12035837-1f7c8a8a7b1455c7.png
會報錯:
12035837-711e6891cee1bdc0.png
不支援時,最好給使用者提示:
12035837-8f9c2687e134013b.png
檢視是否支援
12035837-ec6cbeba9298a579.png
12035837-84177334d25a2dea.png
三:關於不同頁面傳值方式:
12035837-de1510c2746b2793.png
傳值成功
12035837-d60e7bdd840fefef.png
在app.js中寫入:
12035837-932323a05c85c4a0.png
獲取:
12035837-e09c346587f54000.png
獲取成功:
12035837-51bbe20df140ada3.png
能獲取就能設定:用同步的方式去設定引數:另一種傳值方式--不在利用url傳值:
12035837-08d0fe4cd918f82a.png
同樣 用同步的方式獲取資料:
12035837-c327619d290ce3c3.png
12035837-ee97f6116e2b11f6.png
這是聽連勝老師的入門微信小程式開發課程所記的筆記,總結很粗糙,望諒解,有興趣小夥伴配合老師課程聽,這個只是為了節省大家記筆記的時間。

相關文章