微信小程序开发，文档主要看微信官方文档微信小程序官方文档。
辅助网址可以看小程序社区

导航栏标题

与iOS开发很相似，小程序的导航栏也可以全局设置一下，在公共文件app.json中设置了导航栏相关样式如下：

这个地方是全局设置，如果想要在不同的页面设置各自的标题属性，只需要在该子级文件中设置

子页面调用公共js对象以便调用其方法

子页面想调用共公js的方法，需先在子页面js中先实例化app:具体过程如下 //app.js 中写子页面需要调用的公共方法

嵌套循环时候，最好重命名下list和index

善用公共模板

在APP开发中，UI复用是一个很好的手段，在小程序上就是模板template。 在逛小程序联盟的时候发现了一个大湿总结的比我好，搬过来一下。

微信小程序中，如果几个页面中需要引用同一个header/footer，当定义了公共模板时，有两种引用方法如下： 方法一：在公共模板中定义template元素，利用 方法 ,这种方式只会显示公共模板的template里面的内容，之外的内容不会显示

注意：这里的data='{{引入的数据1，引入数据2}}’ 是在template中要提取js文件中的data数据里面的key名字，否则无法显示。 公共模板的wxml:在公共模板中必须定义每一个template的的name的名字，否则引用的时候无法得知引用具体某一个；

要引用的文件js定义数据：

** 方法二:**

公共模板的wxml:

{{title.other}} js定义的数据：

总结：
import方式和imclude方式的不同在于前者仅引用公共模板中的template里面的内容后者仅引用template以外的内容，
显而易见，include方式更简单一些，在wxml中只需要一句话即可。
5.小程序的尺寸单位rpx rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。
如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 0.5px。
具体的这里有一片文章介绍的很详细，还有这个

小程序中用html、css

小程序中的选择器跟css的一样. 1：.class 2： #id 3: element 4:分组 element,element 5：伪类选择器 :after :before 注意这里加入在了元素之内的最后/最前

引入外部css文件的时候，只需像iOS中导入文件那样，在其css文件的开始写上 ： @import “外部地址” 即可。 html中布局用div很多，但是在小程序中用view标签，文本用text。 如果想用html原有的元素，必须在wxss中定义元素的display:block不然无法应用，且html元素的id选择器是无法应用的。

事件总结/冒泡事件

小程序的事件主要有： touchtab 点击事件 touchstart 开始滑动 touchmove 滑动中 touchend 滑动结束 touchcancel 滑动中断

小程序中的wxml中绑定事件有两种：以touchtab为例 ，在wxml中必须有bind/catch不然无法实现上述事件 bindtouchtab和catchtouchtab bind的不会阻止事件冒泡（元素最里层到最外层函数执行），catch会阻止冒泡，只是冒泡到当前层结束 如果想在元素执行某事件时把元素的某个属性传到后台 可在元素中加入data-属性名称=“xxx”,在事件函数中 function(event){}的event中的currentTarget里面的data-set里面可查看接收在元素中绑定的的id或者其他属性clientX/Y 查看滑动手指距离屏幕左侧的位置，查看滑动位置也可以通过touchstart和和touchend的clientx/y获取

点击更换图片

锚点定位

注：scroll-view必须要设置高度，不然无效

调用工具js文件/utils文件中的函数/变量

在小程序中，定义了一项工具文件utils,此文件的js旨在本文件之内有效，当其他子页面想调用其中的js方法或者变量时，需要两步骤：
1：在utils被调用的js文件中，面向对象的方式模型输出： module.exports={要调用的函数名称：要调用的函数名称 }；
2：在要调用的js文件中模块化引入utils的js文件 var object=require(“utils被调用的js文件地址”)；
可以输出一下object就能看到被调用的方法了； 例子如下： utils中被调用的js：

后台交互/wx.request({})方法/渲染页面方法 解析

小程序的后台获取数据方式get/post具体函数格式如下：wx.request({})

wxml页面：

scroll-view用法

广告轮播

微信小程序广告轮播元素 图片所在元素/swiper-item> 其中属性有： autoplay:true,//是否自动播放 autoplaytxt:”停止自动播放”, indicatorDots: true,//指示点 // indicator-color：”white”,//指示点颜色 暂未启动 // indicator-active-color：”red”,//当前选中的指示点颜色暂未启动 indicatorDotstxt:”隐藏指示灯”, interval: 1000,//图片切换间隔时间 duration: 500,//每个图片滑动速度, circular:true,//是否采用衔接滑动 current:3,//初始化时第一个显示的图片 下标值（从0）index

图片更改事件：bindchange=’imgchange’ imagechange()的e.detail.current为当前显示页面的下标值 wxml:

wxjs:

wxss:　

提示框

第二种方式：
// 提交成功 ~~~javascript this.setData({ loadingHidden: true, hideCommitSuccessToast: false })
// 定时，3秒消化 setTimeout(() => { this.setData({ hideCommitSuccessToast: true }) }, 3000)