1. 微信小程序简介及优点
无需安装下载即可使用--需要安装微信(小程序体积很小)
同APP互补,更简洁,引流
搜索下载,成本低,实现App主要功能
小程序没有DOM对象,基于组件开发
组件:将大的JS文件拆成多个,多个数据是私有的,特定功能拥有特定效果的代码集合
2. 文件格式
js 形态
wxml 布局
wxss 样式
json 配置文件
3. 配置设置
flex 弹性布局 。 flex-direction
移动端适配
dpr:设备像素比 =物理像素/设备独立像素 。 iphone 6的dpr=2 人类肉眼识别极限高分辨率屏幕=2 ,当3和2在人眼没有区别
ppi:一英寸上的像素个数
小程序适配方案
1rpx=1物理像素=0.5px rpx:微信小程序的像素单位
布局适口=物理适口
4. 事件
冒泡向上抛出问题
bind+事件 冒泡
cache+事件 非冒泡
5. 模板
定义模板:template name指定模板名
使用模板 is css导入@import
<import src="/pages/template/template-list.wxml"/>
@import \'/pages/template/template-list.wxss\';
列表渲染
<block wx:for=\'{{listArr}}\' wx:key=\'{{index}}\' >
<view>
<template is="listTemplate" data="{{...item}}"/>
</view>
</block>
6. 本地缓存
setStorage
缓存是否收藏文章
缓存前需要获取之前缓存数据,当前缓存数据是基于之前缓存数据的基础上
在onload需要,如果用户第一次进来需要将数据置空
在点击的时候,需要将换出数据进行一个预处理初始化
7. 音乐播放
api使用、采用事件将
将数据可以缓存到app.json
设置以音乐后台播放
"requiredBackgroundModes": [
"audio"
]
github地址:https://github.com/iearl/wxprogram.git
请发表评论