image.png

快捷键

image.png
image.png

js 逻辑
json 配置
wxss 样式
wxml 结构文件

navigationBarTitleText窗口标题
backgroundColor 背景色

image.png

enablePullDownRefresh 下拉刷新

image.png

tabBar

image.png

控制超时时间

image.png

页面配置文件

image.png

小程序生命周期APP

onLaunch 当小程序初始化完
onShow 小程序启动
onHide

Page生命周期

onLoad: 页面加载完，一个页面调用一次，可以获取wx.navigateTo 和wx.redirectTo 和 query
onShow
onReady 初次渲染完
onHide
onUnload
onPullDownRefresh 下拉刷新

全局的数据在app.js中可以设置

globalData:{
userInfo:null
}

页面中的数据设置

Page({
data: {
motto: '呵呵',
userInfo: {},
hasUserInfo: false,
canIUse: wx.canIUse('button.open-type.getUserInfo')
},

绑定事件

image.png

动态设置数据

this.setData({
userInfo:userInfo
})

view,image,text

image.png

判断

wx:if="{{length > 2}}"
wx:else

image.png

<block wx:if=""

image.png

wx:for="{{}}" 循环

image.png

{{index}} {{item.name}}

重命名下标

image.png

for 1到10

image.png

block

image.png

使用模板

image.png

template

导入其他页面

<import src="template.wxml" />

image.png

原原本本导入其他页面include

image.png

事件类型

冒泡事件：touchstart,touchmove,touchcancel,touchend,tap,longtap
非冒泡事件：submit,input, scroll

事件绑定：bindtap

image.png

事件对象event属性

type
timeStamp
target

image.png

touches

image.png
detail

wxss

rpx,rem

image.png

@import "common.wxss"