1:常見使用組件
視圖容器:view swiper scroll-view
基礎內容:text 相當於span標籤
媒體:image video audio
表單:button input checkbox label picker
畫布:canvas
地圖:map
2:生命週期
Onload() 頁面加載時觸發 只會調用一次 可獲取當前頁面路徑中的參數
onShow() 頁面顯示/切入前臺時觸發,一般用來發送數據請求
onReady() 頁面初次渲染完成時觸發 只調用一次 代表頁面已和視圖層進行交互
onHide() 頁面隱藏/切入後臺時觸發 如底部tab切換到其他頁面或小程序切入後臺等
onUnload 頁面卸載時觸發 如 rediectTO 或 navigateBack()到其他頁面時
3:事件綁定Bind catch
bindtap是不會阻止冒泡事件的,catchtap是阻值冒泡的
事件類別 tap longtap touchstart touchend touchcanse
4: 常見指令
Wx:for wx:key wx:if bindtap <navigator url=”” ></navigator>
OnLoad 接受參數
3:組件間傳值
1:父子間傳值
子傳父: 用於子組件向父組件傳遞數據,可以傳遞任意數據
子組件:
父組件:
組件間代碼共享 Behavior
假如多個子組件共享相同的 properties,data,methods,在每一個組件中都去重複粘貼相同的代碼是完全沒有必要的,這個時候可以用到 behavior 新建一個 my-behavior.js 文件
url傳參
<navigator class="gotoDetail"
target="self"
url="../detail/detail?vedioSrc={{item.videoSrc}}"></navigator>
然後在跳轉到的頁面onLoad鉤子函數中 使用options接受參數
onLoad: function (options) {
console.log(options)
this.setData({
vedioSrc:options.vedioSrc
})
},
點擊事件傳參 利用自定義屬性 data-xx =
封裝請求方法:
- wx.navigateTo():保留當前頁面,跳轉到應用內的某個頁面。但是不能跳到
tabbar
頁面 - wx.redirectTo():關閉當前頁面,跳轉到應用內的某個頁面。但是不允許跳轉到
tabbar
頁面 - wx.switchTab():跳轉到
abBar
頁面,並關閉其他所有非tabBar
頁面 - wx.navigateBack()關閉當前頁面,返回上一頁面或多級頁面。可通過
getCurrentPages()
獲取當前的頁面棧,決定需要返回幾層 - wx.reLaunch():關閉所有頁面,打開到應用內的某個頁面
4:轉發分享
Wx.showShareMenu
5:登錄授權流程
6:小程序的雙向綁定和vue的哪裏不一樣
小程序直接this.data 的屬性是不可以同步到視圖的 必須調用
This.setData({xx:aaa})