背景：本猿是一个客户端开发人员，接到要去处理公司小程序开发的任务。就开始着手，小程序开发了。这篇文章的目的也是为了记录和
勇狗(某安卓开发者)共同开发小程序所遇到的问题和解决方案。如此文能帮到各位，不胜欢喜。如有不正还请不吝赐教。
知识准备
处理小程序时，你可能需要一些基本的前端知识，主要包括：HTML，CSS，js的基本知识储备。为什么要说需要HTML的储备呢，小程序的API里有关标签（组件），主要是与勇狗合作时：不注重标签的语义话，结构也混乱一个简单视图会层层嵌套去实现。css主要是展现层：熟知一些常用属性，这里列举 border , 大部分的客户端开发者，可能会写一个div , view 设置一个并设置一个背景色来设置。去实现一个带颜色的分割线的需求！！！ 为什么还要去了解一些js，毕竟小程序不会让你去操作dom. 个人觉得特效，还有诸如对网络请求的分装，Promise finally 的封装罢了。
HTML
有关HTML的语义化,结构化 此处不在赘述此处主要讲述，JJ和狗勇在开发遇到和HTML标签差异化的东西。
-
background,bg设置背景图片的时候，通常在前端background: url("../xxx.png")然而在小程序中不适用，你可以通过将图片转成base64 的编码格式复制到URL中，当然特别长了，不建议使用。小程序的处理方式，是使用image组件。 -
view可以理解为和div类似的块级元素。
CSS
无论是传统的布局方案：display, float, position的组合套餐方式也好，还是使用小程序推荐flex布局方案也好，我觉得总有必要去学习一番。有关CSS属性的使用方法，介绍的文章还有教程太多，此处不去赘述。
-
display，float，position使用方法很多，JJ就根据自己的一些见解来总结一下- 避免使用 脱标流, 文档流能解决的使用文档流，文档流不能解决的可以使用浮动，浮动不能解决的使用定位。
- 有关定位：JJ的使用场景是在第一个版本：此页面是有一个背景图片。第二个场景是图片上有文字。
-
position遵循子绝父相的原则即可，absolute不为元素预留空间，通过指定元素相对于最近的非 static 定位父元素的偏移，来确定元素位置。绝对定位的元素可以设置外边距（margins），且不会与其他边距合并。
-
flex 设置页面背景色小程序的处理方式：
page {
background-color: #F9FAFC;
height: 100%;
}
-
css的层叠性
此处主要涉及一些明明写了样式，却不生效的问题，用于排除问题。- 有必要去了解css选择器的种类，
标签，类，id， 复合选择器又分为：交集选择器，并集选择器，后台选择器，属性选择器，子代选择器。 - 继承的权重
- 有必要去了解css选择器的种类，
- 异常问题：
- 浮动带来的异常效果：
掉盒子，清除浮动 - margin导致的外边距塌陷：请自行查找
- 浮动带来的异常效果：
JS
有关js的了解，我觉得对于有其它OOP编程语言思想的人可以去跳过一些基础语法的学习，更快上手的方式可能是遇到需求自行谷歌，百度就OK了。
- 此处想引入的是小程序
双向绑定，前期可只做了解。 - 渲染相关：
条件渲染，列表渲染; 前期可只做了解。 - 生命周期：小程序API自行查找。
- 事件绑定：了解小程序事件监听的方式； 前期可只做了解。
着手开发
创建项目
有关IDE的选择此处不做过多说明，你可以采用习惯的IDE，然后再选择微信开发工具作为调试工具去处理。此处JJ直接使用卫星开发工具来说明。创建好了项目，使用了测试ID，微信有一个默认的demo，我们可以先操作demo，看看效果，然后再开始去看代码。
-
匆匆一瞥微信的目录结构如下图：
小程序文件目录 -
pages主要放置的是一些页面文件，主要包含：该页面的结构(.wxml), 页面的展现层（.wxss）,页面的逻辑层(.js),页面的配置文件(.js) -
utils主要放置的一些工具类。 -
app.js程序的入口，可根据微信提供的API去进行操作- JJ主要在此地做了一些：全局的监听，
版本更新，初次加载判断网络状态，网络状态变化的监听，会话，通知过期监听
- JJ主要在此地做了一些：全局的监听，
-
app.json项目全局配置：- window：
- tabbar
- 请求延时
- 页面注册："pages" 数组写好页面的路径，
cmd + s会自动生成与指定页面的所有文件。
-
app.wxss- 全局的样式表，比如说全屏的背景色。
- 外层容器的通用样式，和css中的
.wraper.contatiner相似
业务开发
至此从开发者的角度来看，我觉的可以带上设计搞开始将所有页面的结构，展现参照前端的语义话和CSS的标准写出来，至于业务上的路由，组件等可以根据微信开发指南去了解了。
- 对于移动端开发者来说，最心存疑惑的莫过于设备的设备问题了微信的处理方式
- 单位：
rpx - flex布局
- 单位：
- 网络请求：前期可采用微信提供的API，后期可自行分装模块化来解耦
- 会话保持：微信授权成功后的两个参数，是后台需要与微信保持会话链接的两个参数
signaturerawdata - 微信数据的持久化。
- 控件的重复点击
补充
小程序，距本次文章总结已一个月的时间，少许记录有些遗忘，有些不赘述的知识点会在有时间之时加以总结。
Logs
2019-07-08 19:00 last updated
