一、准备工作

一、简介

    微信小程序是运行在微信环境中的应用，无需下载无需安装，它只能在微信中运行，不能在浏览器等其他环境中运行，微信团队提供了专门的开发工具用于微信小程序的开发，还提供了风度的API，让我们的小程序能够具备和微信交互的能力，比如，获取摄像头拍照、访问文件系统等，与微信交互主要体现在一下三个方面：
    1.获取当前登录微信的用户信息；
    2.微信支付；
    3.使用模板消息向微信发送通知；

开发微信小程序需要具备wxml、wcss、JavaScript能力

二、开发工具下载安装

下载：https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
下载完成后按照提示安装

三、新建第一个小程序

新建项目必填项：
AppId：可选择无AppId
项目名称：按照实际填写，全英名称
项目目录：目录名称与项目名称保持一致
勾选“建立普通快速模板”

点击确定后可看到初始页面如下：

四、目录结构及页面组成

1.app.js
App()函数用来注册一个小程序，接受object(对象)类型的额参数，其中onLanuch()会在打开应用时执行
object参数说明：

属性	类型	描述	触发时机
onLaunch	Function	生命周期函数–监听小程序初始化	当小程序初始化完成时，会触发onLaunch(全局只触发一次)
onShow	Function	生命周期函数–监听小程序显示	当小程序启动，或从后台进入前台显示，会触发onShow
onHide	Function	生命周期函数–监听小程序隐藏	当小程序从前台进入后台，会触发onHide
其他	Any	开发者可以添加任意的函数或数据到Object参数中，用this可以访问

2.app.jaon
app.json是对整个小程序的全局配置。我们可以在这个文件中配置小程序是由哪些页面组成，配置小程序的窗口背景颜色，配置导航条样式，配置默认标题等等。注意该文件不可添加任何注释

3.app.wxss

    整个小程序的公共样式，此处定义的样式所有页面都可以用。

4.创建页面及页面组成

创建的页面路径必须在app.json中注册。
页面由wxml、js、wxss、json四个文件组成，四个文件的文件名必须相同。

wxml：组成页面结构，必须
js：页面初始化数据和页面逻辑（如：点击事件），必须
wxss：该页面的页面样式，如果与app.wxss的样式冲突，在该页面中，会优先应用此文件中的样式定义。
json：设置app.json中的window配置项的内容，页面中配置项会覆盖app.json的window中相同的配置项，此处定义的配置项对此窗口起作用

5.Page()

Page()函数用来注册一个页面。接受一个object参数，其指定页面的初始数据、生命周期函数、事     件处理函数等。

object参数说明：

属性	类型	描述
data	Object	页面的初始数据
onLoad	Function	生命周期函数–监听页面加载
onReady	Function	生命周期函数–监听页面初次渲染完成
onShow	Function	生命周期函数–监听页面显示
onHide	Function	生命周期函数–监听页面隐藏
onUnload	Function	生命周期函数–监听页面卸载
onPullDownRefresh	Function	页面相关事件处理函数–监听用户下拉动作
其他	Any	开发者可以任意添加任意的函数数据到Object参数中，用this可以访问

6.页面的路由

路由是一个专业术语，页面路由可以简单地理解为页面切换。

在小程序中所有页面的路由全部由框架进行管理，对于路由的触发方式以及页面生命周期函数如下：

路由方式	触发时机	路由后页面	路由前页面
初始化	小程序打开的第一个页面	onLoad,onShow
打开新页面	调用APIwx.navigateTo或使用组件	onLoad,onShow	onHide
页面重定向	调用APIwx.redirectTo或使用组件	onLoad,onShow	onUnload
页面返回	调用APIwx.navigateBack或用户按左上角返回按钮	onShow	onUnload
Tab切换	多Tab模式下用户切换Tab	第一次打开onLoad,onShow;否则onShow	onHide

项目代码：https://gitee.com/Bronna/Demo1/tree/master