初探“微信小小程序”

初探“微信小小程序”
最近，“微信小程序”这个词占据了朋友圈，大有一番风起云涌之势，当然，还不可能夸张到使原生App开发人员失业这种程度。当然，作为一名技术人员，时刻保持对新技术...

最近，“微信小程序”这个词占据了朋友圈，大有一番风起云涌之势，当然，还不可能夸张到使原生App开发人员失业这种程度。当然，作为一名技术人员，时刻保持对新技术的好奇心是必须的，所以在网上找大神的教程，搭建了一下开发环境，来学习一下这个新的开发框架。

一 项目文件结构

当打开微信小程序的Demo的时候，我个人习惯是先看整个项目的文件结构，先大致弄清这部分是干什么的，那部分又是干什么的，微信小程序基本的文件结构如下图：

图1-微信小程序基本文件结构

首先我们一眼就可以看到，在项目根目录有三个文件，app.js，app.json，以及app.wxss，下面来谈谈我对这三个文件的理解。

1 . app.js

app.js中包含一个App()函数，我把它理解为微信小程序真正意义上的入口，也就是说当启动一个小程序的时候，首先会执行到这里。App()函数用来注册一个小程序，参数为Object类型，可以在其中指定小程序的生命周期函数（理解还不是很透彻）, 当然，也可以定义一个全局的数据和函数，

我们可以在页面中调用全局的getApp()方法，获得小程序实例，从而来调用我们定义的全局数据和函数。

2 . app.json

app.json可以对小程序进行全局的配置，比如我们可以配置小程序有哪些页面、窗口表现形式、设置网络超时时间、设置多tab等。下面就是一个简单的配置：

{ "pages": [ "page/index/index", "page/logs/index" ], "window": { "navigationBarTitleText": "Demo" }, "tabBar": { "list": [{ "pagePath": "page/index/index", "text": "首页" },{"pagePath": "page/logs/logs", "text": "日志" }] }, "networkTimeout": { "request": 10000, "downloadFile": 10000 }, "debug": true}