微信小程式開發文件 知識點小記(2)

2022-09-06 03:27:09 字數 2388 閱讀 9661

api

事件

使用者在渲染層的行為反饋和元件的部分狀態反饋抽象為渲染層傳遞給邏輯層的事件。

事件型別和事件物件

常見的事件型別

touchstart

touchend

touchmove

touchcancel

tap

longtap

transitionend

animationstart

animationiteration

animationend

當事件**觸發的時候,會受到乙個事件物件

type 事件型別

timestamp 頁面開啟到觸發事件所經歷的毫秒數

target 觸發事件的元件的一些屬性值的集合

currenttarget 當前元件的一些屬性值集合

detail 額外資訊

touches 觸控事件,當前停留在螢幕中的觸控點資訊的陣列

changedtouches 觸控事件,當前變化的觸控點資訊的陣列

這裡需要注意的是target和currenttarget的區別,currenttarget為當前事件所繫結的元件,而target則是觸發該事件的源頭元件。

target和currenttarget事件物件屬性

id 當前元件的id

tagname 當前元件的型別

dataset 當前元件上由data-開頭的自定義屬性組成的集合

關於touch和changedtouches物件的詳細引數:

identifier 觸控點的識別符號

pagex,pagey 距離文件左上角的距離,文件的左上角為原點,橫向為x軸,縱向為y軸

clientx,clienty 距離頁面可以顯示區域(螢幕除去導航條)左上角距離,橫向為x軸,縱向為y軸

事件繫結和與冒泡捕獲

事件繫結的寫法和元件屬性一致,以key=『value』的形式,其中:

1 key以bind或者catch開頭,然後跟上事件的型別,如bindtap catchtouchstart bind:tap catch:touchstart;同時bind和catch前還可以加上capture-來表示捕獲階段。

2 value是乙個字串,需要在對應的頁面page構造器中定義同名的函式;

bind和capture-bind的含義分別代表事件的冒泡階段和捕獲階段。

bind事件繫結不會阻止冒泡事件向上冒泡,catch事件繫結惡意阻止冒泡事件向上冒泡

相容

基本的布局方法-flex布局

toast和模態對話方塊

在完成某個操作成功之後,我們希望告訴使用者這次操作成功並且不打斷使用者接下來的操作,使用toast

不應該使用toast用於錯誤提示,因為錯誤提示需要明確告知使用者具體原因,因此不適合這種一閃而過的toast彈出式提示。一般需要使用者明確知曉操作結果狀態的話,會使用模態對話方塊來提示,同時附帶下一步操作的指引。

介面滾動

onpulldownrefresh

onreachbottom

不希望整個頁面進行滾動,而是頁面中某一小塊區域需要可滾動,此時就要使用宿主環境所提供的scroll-view可滾動檢視元件。可以通過元件的scroll-x scroll-y 屬性決定滾動區域是否可以橫向或者縱向滾動

發起https網路通訊

小程式經常乣往伺服器傳遞資料或者從伺服器拉取資訊,這個時候可以使用wx.request這個api

wx.request

urldata

header

method

datatype

success

fail

complete

伺服器介面

url引數是當前發起請求的伺服器介面位址,小程式宿主環境要求request發起的網路請求必須是https

協議請求,同時為了保證小程式不亂用任意網域名稱的服務,wx.request請求的網域名稱需要在小程式管理平台進行配置

微信小程式開發小知識點

在元件上使用 wx for 控制屬性繫結乙個陣列,即可使用陣列中各項的資料重複渲染該元件。預設陣列的當前項的下標變數名預設為 index,陣列當前項的變數名預設為 item。for 或者可以指定 使用 wx for item 指定陣列當前元素的變數名,使用 wx for index 指定陣列當前下標...

微信小程式開發文件 畫布

canvas 屬性名型別預設值 說明canvas id string canvas 元件的唯一識別符號 disable scroll boolean false 當在 canvas 中移動時且有繫結手勢事件時,禁止螢幕滾動以及下拉重新整理 bindtouchstart eventhandle 手指觸...

微信小程式怎麼開發 小程式開發文件

2.建立專案 我們需要通過開發者工具,來完成小程式建立和 編輯。3.編寫 建立小程式例項 建立頁面 每乙個小程式頁面是由同路徑下同名的四個不同字尾檔案的組成,如 index.js index.wxml index.wxss index.json。js字尾的檔案是指令碼檔案,json字尾的檔案是配置檔...