微信小程序平台规划 第1篇
小程序面向产品与服务，主要以实现业务功能为主，致力于打造线上线下相融合的企业服务场景。
微信公众号主要服务于企业和个人的营销与信息传递需求，是一种新的信息传播方式。公众号依赖粉丝经济，结合H5后，能够在公众号内提供一些简单的营销和交互功能。
用户体验的差别
微信小程序对用用户交互性能做了众多的优化，使用体验接近App。而公众号开发借助于H5 开发技术来实现交互功能，运行环境是基于浏览器，等同于手机网页端的应用。因此上微信公众号主要用于业务逻辑与交互简单的应用中，体验良好的应用都应该用小程序来创建或者重构。
具体上来说微信小程序被微信平台开放了更多的接口功能，基本可覆盖大多数行业的需求。相较于公众号，它在视频直播、商城、小游戏等强互动的领域表现更佳。公众号开发适合用户交互相对较少的应用类型，比如微商城、微官网等。
虽然微信公众号与小程序各有一定的应用场景，但是在实际上使用时不是二选一的，一个企业可以同时注册微信公众号和小程序。企业使用微信小程序承载企业的业务服务，并使用公众号进行企业的宣传与营销。微信公众号是单独申请的，微信小程序即可以单独申请，也可以通过微信公众号快捷申请。对于没有公众号和小程序的商家来说，正确的申请注册流程应该是先申请认证微信公众号，然后在公众号后台的【小程序管理】页面中直接快速注册小程序。微信公众号+小程序的模式已经成为企业运营推广的一个标配。
开发微信小程序需要首先注册一个小程序账号，注册成功后登录微信小程序管理后台，完成小程序开发者绑定、开发信息配置，然后开发者就可以下载开发者工具、使用开、发者工具进行小程序的开发了。
微信公众号是单独注册申请的，微信小程序即可以单独注册申请，也可以通过微信公众号快捷申请注册。对于没有公众号和小程序的商家来说，正确的申请注册流程应该是先申请认证公众号，然后在公众号管理后台的【小程序管理】页面快速申请小程序。微信公众平台的网址为：。微信小程序注册是需要一个邮箱作为账号，小程序注册成功后，可以使用该邮箱+登录密码登录微信小程序管理后台。为方便开发者开发和体验小程序的各种功能，开发者可以申请小程序的测试号，并使用此帐号在开发者工具创建项目并进行开发测试，以及真机预览体验。小程序的测试号使开发者避免了繁琐的注册过程，降低了初始使用小程序开发的门槛。小程序的测试号的申请地址为：
小程序开发的账号申请成功之后，需要登录小程序管理后台进行小程序的设置，填写小程序基本信息，例如名称、头像、介绍以及服务范围等。 您可以在【开发】->【开发管理】页面中看到小程序的AppID。小程序的AppID相当于小程序平台的一个身份证，后续你会在很多地方用到它。
另外在进行小程序开发前，需要在微信小程序后台将开发人员的微信号添加到项目成员中。只有添加到小程序项目成员的人员才可以使用微信小程序开发工具进行小程序开发、调试、上传程序包等功能。建议您可以将全部研发人员加入到项目成员中，项目组的其他非开发人员若需要体验小程序功能则需要添加到体验成员中。
由于小程序采用的是渲染和逻辑分离的运行机制，这种做法与传统的网页的运行机制存在差异，无法使用传统的网页编程中的开发、调试工具，为此微信专门为小程序开发推出了一个一站式IDE：微信开发者工具。开发者可以借助微信开发者工具完成小程序的代码开发、编译运行、界面和逻辑调试、真机预览和提交发布版本等功能。
在小程序开发文档中可以找到小程序开发工具的下载页面，或者直接输入以下 网址进入小程序开发工具的下载页面：。在小程序开发工具的下载页面中根据自己的操作系统下载对应的安装包并进行安装。需要注意的是，小程序开发工具在Windows仅支持Windows 7及以上版，在Mac上支持OS X 及以上版本。另外需要说明的是微信小程序Web开发工具需要扫码登陆才可以使用，所以在使用前必须先绑定开发者。
首次使用开发者工具调试小程序时会出现这样的报错：“xxxxxxxxxx不在合法域名列表中”，这是因为在小程序中发起了请求，但是请求的域名没有在小程序管理后台中进行设置所致。服务器域名的设置请到小程序管理后台【开发】->【开发管理】->【开发设置】->【服务器域名】中进行配置。配置时需要注意：域名只支持https （、、） 和 wss () 协议。域名不能使用 IP 地址（小程序的局域网 IP 除外）或 localhost。
微信小程序平台规划 第2篇
盒子模型结构
盒子模型元素
块级元素与行内元素：display属性控制
1.块级元素：
特点：一个块级元素占一行如添加新的块级元素自动换行
块级元素的宽度、高度、外边距及内边距都可以自定义设置
2.行内元素
display属性设置为inline
特点：不能设置高度和宽度
同一块内，行内元素与其他行内元素同占一行
3.行内块元素
display属性设置为inline—block
特点：可以设置高度、宽度、内外边距
元素可以显示在同一行
1.元素浮动与清除
浮动：float属性定义浮动
none——默认值，表示元素不浮动
left——元素向左浮动
right——元素向右浮动
清除：clear属性定义清除
left——清除左边浮动的影响
right——清除右边浮动的影响
both——同时清除左右两侧浮动的影响
none——不清除浮动
2.元素定位
position属性来实现页面元素的精准定位
static:默认值
relative:相对定位
absolute:绝对定位
fixed：固定定位
flex布局模型
1.容器属性
1）display
flex——块级flex布局，该元素变为弹性盒子
inline-flex——行内flex布局，行内容器符合行内元素的特征，同时在容器内又符合flex布局规范
2）flex-direction
row——主轴为水平方向，起点在左端
row-reverse——主轴为水平方向，起点在右端
column——主轴为垂直方向，起点在顶端
column-reverse——主轴为垂直方向，起点在底端
3）flex-wrap
nowrap——不换行，默认值
wrap——换行，第一行在上方
wrap-reverse——换行，第一行在下方
4）flex-flow
row nowrap——默认值
是flex-direction和flex-wrap的组合形式
格式： .box{flex-flow:
5）justify-content
justify-content——与主轴方向有关，默认主轴水平对齐，方向从左到右
flex-start——左对齐，默认值
flex-end——右对齐
center——居中
space-between——两端对齐，项目之间的间隔都相等
space-around——每个项目两侧的间隔相等
6）align-items
align-items——与交叉轴方向有关，默认交叉由上到下
flex-start——交叉轴起点对齐
flex-end——交叉轴终点对齐
center——交叉轴中线对齐
baseline——项目根据它们第一行文字的基线对齐
stretch——如果项目位设置高度或设置为auto，项目将在交叉轴方向拉伸填充容器，此为默认值
7）align-content
space-content——与交叉轴两端对齐，轴线之间的间隔平均分布
space-around——每根轴线两侧的间隔都相等，轴线之间的间隔比轴线轴线于边框之间大一倍
2.项目属性
1）order(顺序) 数值越小，排名越靠前，默认值为0
2）flex-grow(放大）默认值为0，即不放大
3）flex-shrink(缩小） 默认值为1，如果空间不足，该项目将被缩小
4）flex-basis(进行缩放) 定义伸缩项目的基准值，剩余的空间将按比例进行缩放，默认值：auto
5）flex 是对flex-grow、flex-shrink、flex-basis的简写，默认值为0、1、auto。
6）align-self 该属性会重写默认的对齐方式，除了auto以外，其余属性与容器align-items属性一致
微信小程序平台规划 第3篇
基本目录结构中，项目主目录下有2个子目录（pages和utils）和四个文件（、、和）
：项目配置文件，包含项目名称、AppID等相关信息。
pages:有两个子目录（index和log）一个页面包含4个不同的扩展名（.wxml（页面结构文件）、.wxss（页面样式文件）、.js（页面逻辑文件）、.json（页面配置文件）
Utils:工具包，用来存放一些公共的.js文件
:小程序逻辑文件，主要用来注册小程序全局实例
:小程序公共设置文件，配置小程序全局设置
:小程序主样式表文件，类似HTML的.css文件(就近原则）
.js:逻辑文件
.json:配置文件
.wxml:结构文件
.wxss:样式文件
视图层是所有.wxml文件与.wxss文件的集合；.wxml文件用来描述页面的结构；.wxss文件用来描述页面的样式。
逻辑层用于处理事务逻辑；对于微信小程序而言，逻辑层就是所有.js脚本文件的集合。
在逻辑上包括页面临时数据或缓存、文件存储（本地存储）和网络存储与调用。
1.页面临时数据或缓存 在Page（）中，使用setData函数将数据从逻辑层发送到视图层，同时改变对应的的值。
setData（）函数的参数接受一个对象，以（key,value）的形式表示将key在中对应的值改变成value。
2.文件存储（本地存储） 使用数据API接口，如下：
3.网络存储与调用 上传或下载文件API接口，如下：
调用URL的API接口，如下：
1) pages配置项
1>数组的第一项用于设定小程序的初始页面。
2>在小程序中新增或减少页面时，都需要对数组进行修改。
3>文件名不需要写文件扩展名。小程序框架会自动寻找路径及对.js、.json、.wxss、.wxml文件进行整合数据的绑定
2)Window配置项
3）tabBar配置项
tabBar中的list选项
4）networkTimeout配置项
5)debug配置项
页面配置文件（*.json）只能设置本页面的窗口表现，而且只能设置window配置项的内容
Page（）方法用来注册一个页面，并且每个页面有且仅有一个
1）设置初始数据
数据必须是可以转成JSON的格式（字符串、数字、布尔值、对象、数组）。
2）定义当前页面的生命周期函数
页面的生命周期函数主要有：onLoad、onShow、onReady、onHide、onUnload
onLoad：页面加载函数
onShow：页面显示函数
onReady：页面数据绑定函数
onHide：页面隐藏函数
onUnload：页面卸载函数
3）定义事件处理函数
4）使用setData更新数据
数据绑定使用Mustache语法（{{}}）将变量或运算规则包起来
1）简单绑定（{{ }}）（内容、组件属性、控制属性）
2）运算{{ }}（算术运算、逻辑运算、三元运算、字符运算）
1）wx:if——判断是否数据绑定当前组件
2）block wx:if——多个组件进行条件数据绑定
1）wx:for——绑定数组，将数据中的各项数据循环进行数据绑定
2）block wx:for——多个组件进行列表数据绑定
1）定义模板
语法：
2）调用模板
语法：
1）import方式：定义模板代码
2）include方式：除模板之外的其他代码
1）定义事件函数 在.js文件实现
2）调用事件 注册事件
冒泡事件：是指某个组件上的事件被触发后，事件会向父级元素传递，父级元素再向其父级元素传递，一直到页面的顶级元素
非冒泡事件：是指摸个组件上的事件被触发后，该事件不会向父节点传递
微信小程序平台规划 第4篇
微信小程序是由腾讯公司在2011年1月21日推出的，最终在2017年1月正式上线
1.无须安装；2.触手可及；3.用完即走；4.无须卸载
1.简单的业务逻辑
2.低频度的使用场景
1.注册小程序账号
2.开发环境准备
3.微信开发工具的下载及安装
4.创建第一个小程序项目
5.运行及发布小程序
工具栏：实现多功能
模拟区：选择模拟手机的类型、显示比例、网络类型
目录文件区：显示当前项目的目录结构
微信小程序平台规划 第5篇
1.开发流程简单，零门槛制作
2.行业模板多样，种类齐全
3.丰富的功能组件和强大的管理后台
1.菜单栏
2.工具栏
包括页面管理和组件库
用来制作小程序页面的主要区域
4.属性面板
设置选定组件的属性及样式
“组件样式”选项卡用来设置组件的样式
1.双栏组件
2.分割线组件
3.弹窗组件
4.面板组件
5.自由面板组件
6.滑动面板组件
7.动态分类组件
8.分类导航组件
9.侧边栏组件
10悬浮窗组件
11.分类横滑组件
1.文本组件
2.图片组件
3.按钮组件
4.标题组件
5.商品列表组件
6.视频组件
8.轮播组件
9.公告组件
1.动态列表组件
2.个人中心组件
3.动态表单组件
4.评论组件
5.计数组件
6.地图组件
7.悬浮框组件
1.音频组件
2.动态容器组件
1.数据统计
2.用户管理
3.商品管理
4.订单管理
5.营销推广
6.账单总结
7.店铺管理
8.功能模块
9.系统设置
二次开发小程序是通过下载代码进行导入运行具体如下：
系统设置 / 微信小程序设置 / 版本设置
微信小程序平台规划 第6篇
实现向服务器发送请求、获取数据等各种网络交互操作。
用于将本地资源上传到开发者服务器，并在客户端发起一个HTTPS POST 请求。
用于实现从开发者服务器下载文件资源到本地，在客户端直接发起一个HTTP GET 请求，返回文件的本地临时路径。
1.选择图片或拍照((Object))
2.预览图片((Object))
3.获取图片信息((Object))
4.保存图片到系统相册((Object))
1.开始录音((Object))——用于实现开始录音。主动调用接口或录音超过1分钟时，系统自动结束录音，并返回录音文件的临时文件路径。要持久保存。需要调用()
2.停止录音((Object))——用于实现主动调用停止录音
1.播放语音((Object))
用于开始播放语音，同时只允许一个语言文件播放。
2.暂停播放((Object))——用于暂停正在播放的语音。如果想从头播放需要调用()
3.结束播放((Object))——用于结束播放语音
1.播放音乐((Object))
2.获取音乐播放状态((Object))
相关参数
成功返回相关参数
3.控制音乐播放进度((Object)）
4.暂停播放音乐(())
5.停止播放音乐(())
6.监听音乐播放((CallBack))
7.监听音乐暂停((CallBack))
8.监听音乐停止((CallBack))
1.保存文件((Object))——用于保存文件到本地
2.获取本地文件列表((Object))——用于获取本地已保存的文件列表
3.获取本地文件的文件信息((Object))——用于获取本地文件的文件信息
4.删除本地文件((Object))——用于删除本地存储的文件
5.打开文档((Object))——用于新开页面打开文档
(Object))——将数据存储到本地缓存接口指定的key中
(key，data)——是同步接口，参数只有key和data
(Object)——从本地缓存中异步获取指定key对应的内容
(key)——从本地缓存中同步获取指定key对应的内容，参数只有key
(Object)——用于从本地缓存中异步移除指定key
(key))——用于从本地缓存中同步删除指定key对应的内容。参数只有key。
()——用于异步清理本地数据缓存，没有参数。
()——用于同步清理本地数据缓存。
用于获取当前用户的地理位置、速度，需要用户开启定位功能
相关参数
成功返回相关信息
用于在打开的地图中选择位置
相关参数
成功返回相关信息
用于在微信内置地图中显示位置信息
相关参数
成功返回相关信息
1）获取网络状态((Object))
成功调用后，返回网络类型包有：wifi、2G、3G、4G、unknown（Android下不常见的网络类型）、none（无网络）
2）监听网络状态变化((CallBack))
用于监听网络状态变化，当网络状态发生变化时，返回当_络状态类型及是否有网络连接。
用于实现调用手机拨打电话
用于调起客户端扫码页面
相关参数
成功返回相关信息
微信小程序平台规划 第7篇
需要共用电商资源，推动小程序私域快速起步；
线下资源不易整合；
领导层需要在小程序私域与线下业务之间提供明确利益协同。
（4）模式四：独立团队
重视小程序私域，对小程序私域定位为全渠道自营业务，并给予充足资源支持；
领导层需明确小程序绩效目标以及与线下和电商业务的利益协同。
04
完成商城搭建
05
商城长期运营