微信小程序学习（原生）

# 原生小程序

# 什么是小程序？

1. 无需下载，用完即走（体积太小，刚发布的压缩包体积最大不能超过1M，2017年4月将1M提升2M）

# 小程序特点

1. 体积小
2. 同app进行互补的，可以实现app基本的功能
3. 微信扫一扫或者是搜索就可以去下载
4. 开发周期短，成本较低

# 适配方案

1. viewport适配 width = device-width
2. 单位：rpx
3. iphone6：1rpx = 1物理像素 = 0.5px dpr = 物理像素/设备独立像素 = 2

# 重要的文件

1. wxml view结构 ---> html
2. wxss view样式 ---> css
3. js view行为 ---> js
4. json文件：数据 && 配置

# 注册小程序

App()

# 注册页面

Page()

# 数据绑定

1. 在data中初始化页面需要的数据，在页面可以直接使用

# 事件（冒泡事件 || 非冒泡事件）

1. 冒泡事件：bind + 事件名
2. 非冒泡事件：catch + 事件名

# 模板template

1. 定义：template 属性：name(标识模板)
2. 使用：template 属性：is(模板的name)
3. 引入模板结构：<import src='路径'/>
4. 引入模板样式：@import '路径'
5. 传参：data="{...item}"(*tip:双中括号)

# 列表渲染

1. wx:for
2. wx:key（为每个个体元素进行标记）
3. 遍历的个体：item
4. 遍历的下标：index

# 本地缓存(setStorage, setStorageSync)

1. 缓存的是用户本地的数据
2. 注意：
   1. 缓存之前应该先去获取之前本地缓存的数据
   2. 缓存的新数据是在原有数据的基础上进行的
   3. 当页面加载的时候onLoad中获取本地缓存数据
   4. 如果storage中没有缓存过，通过key获取的value为空！
   5. 如果用户之前没有缓存过的话：初始化一个空对象在storage中

# 音乐播放

1. 如何知道音乐在播放或者暂停
2. 在app全局变量中设置播放音乐的页面状态

# 分享功能(showActionSheet)

1. itemList为按钮的文字数组，数组长度最大为 6
2. 个人账号无法使用分享功能，使用企业提供的账号

# 转发功能(button组件下的open-type属性)

1. share：触发用户转发

# tab切换(tabBar)

1. list：tab 的列表，最少 2 个、最多 5 个 tab，tab 按数组的顺序排序，每个项都是一个对象，其属性值如下：
   • pagePath：页面路径，必须在 pages 中先定义
   • text：tab 上按钮文字
   • iconPath：图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，
   • selectedIconPath：选中时的图片路径，icon 大小限制为 40kb，建议尺寸为 81px * 81px，不支持网络图片。
2. 当 position 为 top 时，不显示 icon。

# 发送ajax请求实现数据交互(wx.request)

1. 测试勾选不校验合法域名、web-view（业务域名）、TLS版本以及SSL证书，实际使用需要https请求
2. 为了减轻服务器负担，应当设置全局变量缓存获得的数据留作备用

# 路由跳转

1. wx.redirectTo与wx.navigateTo方法需要跳转的应用内非 tabBar的页面的路径 (代码包路径), 路径后可以带参数。
2. wx.switchTab：跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面，路径后不能带参数。