必备技能

小程序开发必备知识点

1.onLoad和onShow

onLoad	onShow
监听页面加载	监听页面显示
一个页面只会调用一次	页面每次出现都会触发
参数中获取打开当前页面路径中的参数	参数中获取打开当前页面路径中的参数（app.js中例外，参数在options.query中）

2.页面事件处理函数

onPullDownRefresh()	onReachBottom()	onPageScroll(Object)
监听用户下拉刷新事件	监听用户上拉触底事件	监听用户滑动页面事件
json中配置" enablePullDownRefresh": true	json中 设置触发距离onReachBottomDistance	scrollTop： 页面在垂直方向已滚动的距离（单位px）
wx.stopPullDownRefresh可以停止当前页面的下拉刷新。	在触发距离内滑动期间，本事件只会被触发一次	--

3.数据

// 使用数据
this.data.参数名
// 改变数据(数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）)
this.setData({
    参数名: 参数值
}, function() { // setData引起的界面更新渲染完毕后的回调函数
    
})

4.路由

navigateTo	switchTab	navigateBack
打开新页面	Tab 切换	页面返回
只能打开非 tabBar 页面	只能打开 tabBar 页面	--

5.全局应用实例

1.在app.js中 App()设置globalData

2.获取实例

var app = getApp()
app.globalData.参数名

3.改变实例数据

app.globalData.参数名 = 参数值

6.wx:if vs hidden

wx:if	hidden
控制销毁或重新渲染	控制显示与隐藏
只使用一次时选择wx:if	需要频繁切换时使用

7. bindtap vs catchtap

bindtap	catchtap
不会阻止冒泡事件向上冒泡	可以阻止冒泡事件向上冒泡

以bind开头的事件类型不会阻止冒泡事件向上冒泡；以catch开头的事件类型可以阻止冒泡事件向上冒泡

8.事件对象绑定和获取

1.组件上通过 data-参数名="参数值" 绑定

2.通过 e.currentTarget.dataset.参数名 获取参数值

9.组件通信与事件

1.父传子

// 父组件
<component name="component" bindmyevent="onMyEvent" />
// 子组件
Component({
    properties: {
        name: String
    }
})

2.子传父

// 子组件
this.triggerEvent('myevent', myEventDetail, myEventOption)
// 父组件
onMyEvent: function(e){
    e.detail // 自定义组件触发事件时提供的detail对象
}

10.父组件使用子组件方法

// 父组件
<component id="component " />
this.selectComponent("#component ").close()
// 子组件的方法
close() {
    console.log('触发子组件方法')
}

11.behaviors

behaviors 是用于组件间代码共享的特性，类似于一些编程语言中的“mixins”或“traits”

var myBehavior = require('my-behavior')
Component({
    behaviors: [myBehavior]
})

12.数据缓存

设置缓存

wx.setStorage(Object)	wx.setStorageSync(key， data)
异步存储	同步存储

获取缓存

wx.getStorage(Object)	wx.getStorageSync(key)
异步获取	同步获取

13.常用交互

wx.showModal(Object)	wx.showToast(Object)	wx.showLoading(Object)
显示模态对话框	显示消息提示框	显示 loading 提示框