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字尾的檔案是配置檔...