微信小程序开发总结

就是天气预报啦.gif

1、注册小程序帐号
2、微信开发者工具
3、开发者文档

技术栈: JavaScript+WXML+WXSS

JavaScript: 微信小程序的 JavaScript 运行环境即不是 Browser 也不是 Node.js。它运行在微信 App 的上下文中,不能操作 Browser context 下的 DOM,也不能通过 Node.js 相关接口访问操作系统 API。所以,严格意义来讲,微信小程序并不是 html5,虽然开发过程和用到的技术栈和 html5 是相通的。

WXML:为微信小程序的展示层,并不是使用 Html,而是自己发明的基于 XML 语法的描述。

WXSS: 用来修饰展示层的样式

目录结构结构


├── pages

|   ├── index

|   |   ├── index.json  index 页面配置

|   |   ├── index.js    index 页面逻辑

|   |   ├── index.wxml  index 页面结构

|   |   └── index.wxss  index 页面样式表

|   └── log

|       ├── log.json    log 页面配置

|       ├── log.wxml    log 页面逻辑

|       ├── log.js      log 页面结构

|       └── log.wxss    log 页面样式表

├── app.js              小程序逻辑

├── app.json            小程序公共设置

└── app.wxss            小程序公共样式表

生命周期

微信小程序开发总结_第1张图片
生命周期图.png

小程序的生命周期分为程序页面两个部分:
程序:有启动(未显示)、显示出来了和隐藏三个事件。

页面:有加载、显示出来了、准备好了(首次)、卸载页面、隐藏页面五个事件。

onPullDownRefresh:下拉刷新的时候。
onReachBottom:上拉无限加载的时候。
onShareAppMessage: 点击右上角分享按钮的时候。

触摸事件

微信小程序开发总结_第2张图片
触摸事件.png

tap:点击
longap:长按
touchstart:触摸开始
touchend:触摸结束
touchmove:触摸移动(比如可用于拖拽排列列表)
touchcancel:触摸取消

组件事件

硬件能力

1、从本地相册选取照片视频
2、拍照或录像
3、扫描二维码
4、录制语音
5、直接打开doc, xls, ppt, pdf, docx, xlsx, pptx
6、保存文件到微信 app 目录
7、获取地理位置
8、获取用户手机型号、设备像素比、窗口宽高、语言、微信版本号、操作系统版本、客户端平台
9、获取网络状态:2g,3g,4g,wifi
10、监听重力感应器,5次/秒,可以做摇一摇等
11、监听罗盘数据,5次/秒
12、直接拨打电话(企业宣传留个咨询电话)

微信能力

1、微信登录
2、获取用户的头像、昵称、性别、国家、城市、省份
3、微信支付
4、模板消息
只有以下两种行为可以触发模板消息
支付
当用户在小程序内完成过支付行为,可允许开发者向用户在7天内推送有限条数的模板消息(1次支付可下发1条,多次支付下发条数独立,互相不影响)
提交表单
当用户在小程序内发生过提交表单行为且该表单声明为要发模板消息的,开发者需要向用户提供服务时,可允许开发者向用户在7天内推送有限条数的模板消息(1次提交表单可下发1条,多次提交下发条数独立,相互不影响)
5、客服消息
用户通过客服消息按钮进入会话,1分钟内可下发1条消息,超时不能发送;
用户在客服窗口发送信息,可回复 3 条且需要 48 小时内回复
6、分享到聊天窗口
分享图片不能自定义;会取当前页面,从顶部开始,高度为 80% 屏幕宽度的图像作为分享图片。

你可能感兴趣的:(微信小程序开发总结)