微信小程式筆記(1)

2020-10-25 09:00:32

1.資料傳輸的時候

1)字串(複雜資料型別、陣列和物件)
2)xml
3)json
{} 物件 (鍵值對 : (屬性名:屬性值);鍵值對之間用 , 隔開)
[] 陣列(每一個索引位置對應一個值;索引之間用 ,隔開)
json模型不可以用註釋

2.十六進位制配色(學習)
https://zhuanlan.zhihu.com/p/61403287?utm_source=QQ_article_bottom

3.json
物件 「backgroundTextStyle」:「light」,//下拉後loading的顏色
「navigationBarBackgroundColor」: 「#000」, //修改頭部背景顏色
「navigation(導航)Bar(欄)Title(標題)Text(文字)」: 「我的微信」, //修改頭部字型
「navigationBarTextStyle」:「white」 //修改頭部字型顏色
「enablePullDownRefresh」: true, //下拉重新整理
「backgroundColor」:"#ddd" // 下拉重新整理背景顏色
陣列
「networkTimeout」: {
「request」: 20000,(20000為毫秒20秒)
「connectSocket」: 20000,
「uploadFile」: 20000,
「downloadFile」: 20000
}

WXML->HTML (微信的標籤語言,做內容的呈現)
WXSS->CSS (微信的樣式表,做樣式的改變)
JS->Javascript (頁面的JS指令碼,承載的是接收和返回資料以及和伺服器互動的一些邏輯處理)
JSON->Javascript(json物件) (完成當前頁面的設定資訊)
APP->application

5.編碼要求
1)不能直接使用HTML檔案
2)可以使用全部的CSS檔案
3)JS指令碼檔案沒有Window物件(微信小程式的核心上是不存在Window物件的)

6.小程式和小遊戲是無法發朋友圈的,可以轉發到群和好友

7.console.log("")和console.info("")都可以在偵錯程式下呈現

8.wxml文字

9.text->font(span)[Html]

10.微信自有的單位rpx
通常單位px
iphone6 1px=2rpx
1px=2.0xxrpx

11.view有兩個作用
容器
特定的換行

12.輪播圖先停在哪張圖上
每個圖可以用current=「0」(0、1、2、3···)
如果每張圖都有一個特定的字元可以用current-item-id="···"
【注意:此部分console不會報錯,0與o也不會報錯】

  1. vertical輪播圖縱向滑動

14.previous-margin=「20」 next-margin="20"意思是輪播圖片前後各留20個畫素,方便使使用者知道後面還有內容

15.display-multiple-items="2"意思是輪播圖同時顯示兩張圖片

16.橫向佈局:
display-flex: flex-direction:row justify-content: align-item:
縱向佈局 flex-direction:column

17.微信在對屬性賦值(布林值boolean)是不會對布林值進行轉換的,只要裡面有內容不是false,他都會認為是true;

11
22

11 22

18.渲染在wxml中wx:if="{{flag}}"這是表示顯示與否

19.if和hidden
if前後兩端程式碼不一定全部渲染載入
hidden全部進行渲染載入
if前後消耗高於hidden
hidden初始化時消耗高於if

20.template.wxml


…表示解析符

21.

name:{{name}}
age:{{age}}

name:{{name}} age:{{age}} name:{{name}} age:{{age}}

22.import參照
a.wxml
b.wxml
c.wxml
b參照了a b中呈現ab
c參照了b c中呈現bc
import沒有繼承性的

23.include包含

24.事件
事件源
事件監聽
事件處理程式

25.bind+事件型別或catch+事件型別作為使用者的事件繫結監視器,連線事件源和事件處理程式
冒泡事件:當一個元件上的事件被觸發後,該事件會向父節點傳遞
(touchmove, tap, longtap)
非冒泡事件:當一個元件上的事件被觸發後。該事件不會向父節點傳遞
(catch)

26.

audioItem:{
src:"/pages/music/I Love You.mp3",
name:「New Path New Life (Orchestral Edition)」,
author:「Gothic Storm」,
poster:「https://s3.ap-northeast-1.wasabisys.com/img.tw511.com/202010/3697620749uuojcsrsez0.jpg」
}

27.放在js檔案中data中的資料是初始資料,在頁面開啟時呈現出來的。

28.text:標準鍵盤,字母數位都有
number:只有數位鍵盤
digit:顯示鍵盤時帶有小數點

29.a a1 a2 a3
b b1 b2 b3