微信小程序开发
小程序开发
浏览：640 次
有利条件
无需安装。
它随处可见，随处可见。
使用后，无需写入卸载。
小程序的app地址。
安装微信小程序工具
小程序的目录结构
app。js（applet的主逻辑）
app。Json（小程序全局公共配置）
app。Wxss（小程序全局公共样式表）
覆盖页面的全局配置
创建新页面
在pages目录下，右键单击以创建新目录，并在当前创建的目录下创建新的页面框架。
在app.json的pages选项中添加新页面的路径。
小程序和页面的生命周期
*小程序生命周期：
https://developers.weixin.qq.com/miniprogram/dev/reference/api/App.html
app({
onLaunch（选项）{
//启动时做一些初始操作。
},
onShow（选项）{
//表演时做点什么。
},
打开隐藏（）{
//躲起来的时候做点什么。
},
onError（消息）{
控制台.log（消息）
},
globalData:'我是全局数据'
})
onLaunch全局只能触发一次。
*页面生命周期：
第页({
/**
*页面的初始数据
*/
数据：{
},
/**
*生命周期功能——监听页面加载
*/
onLoad:函数（选项）{
console.log（“onload”）
},
/**
*生命周期函数——聆听页面第一次呈现的完成情况
*/
onReady:函数（）{
console.log（“onReady”）
},
/**
*生命周期功能——监控页面的显示
*/
onShow:函数（）{
console.log（“onShow”）
},
/**
*生命周期功能——隐藏监听页面
*/
onHide:函数（）{
onsole.log（“onHide”）
},
/**
*生命周期功能--侦听页面卸载
*/
onUnload:函数（）{
onsole.log（“onUnload”）
},
/**
*与页面相关的事件处理功能——监听用户下拉操作
*/
onPullDownRefresh:函数（）{
},
/**
*页面拉底事件的处理功能
*/
onReachBottom：函数（）{
},
/**
*用户单击右上角共享
*/
onShareAppMessage:函数（）{
}
})
OnLoad和onReady仅渲染一次。
小程序大小单位：“rpx”
柔性布局
数据绑定
Mustache语法：｛｛｝｝
单向数据绑定
动态数据绑定
小程序通过此进行分配。setData（对象）
var api数据={
textStr:“服务器数据”，
名称：“千斤顶”
};
this.setData（apiData）；
获取数据的价值
此数据。关键值
小程序的条件呈现
Wx：如果为真，则将显示元素。如果为false，则不会显示元素。
小程序的列表呈现
Wx:对于绑定数组，Wx:for item value是当前变量名，Wx:for index是当前下标变量名。
>｛｛item.name｝｝
小程序事件绑定和事件交互
绑定+事件方法
你需要用js编写相应的方法
<视图>
｛｛changeText｝｝
更改文本
--------------------------
数据：{
//textStr:“hello word11”
//得分：90
数据列表：[]，
changeText:“你好hundun”
},
changetext:函数（）{
//console.log（1）
this.set数据({
更改文本：“ni hao ya”
})
},
longtap:函数（）{
console.log（“longtap”）
},
小程序事件机制捕获和绑定
Bind将使用冒泡机制，catch将防止事件冒泡。
捕获阶段绑定和捕获
捕获绑定：点击
捕获捕获：点击
