微信小程序学习初探
序
9月21日，传闻已久的微信申请号以“微信公众平台小程序”的名义正式发布，内部测试系统依然采用。目前只有少数开发者可以使用。微信之父张小龙在朋友圈介绍，这个小程序是一个不用下载安装就可以使用的应用。用户可以通过浏览或搜索来打开应用程序。对于用户来说，应用触手可及，对于微信来说，则体现了跑不掉的想法。Application号出来后，有人说这次微信会颠覆AppStore，开发者可以直接基于微信开发小程序，不用开发任何app。甚至有人说微信是操作系统。是真的吗？反正先来看看微信小程序。
项目文件结构
打开微信小程序的Demo时，我个人的习惯是先看看整个项目的文件结构，先大致了解一下这个部分在做什么，哪个部分在做什么。微信小程序的基本文件结构如下：
首先，我们一眼就能看出项目根目录下有三个文件，app.js、app.json和app.wxss，下面就来说说我对这三个文件的理解。
1 .app.js
app.js中有一个App()函数，我理解为微信小程序的真正入口，也就是说在启动一个小程序的时候，会先在这里执行。App()函数用于注册小程序，参数为Object类型，可以在其中指定小程序的生命周期函数(不太懂)。当然，你也可以定义一个全局数据和函数。我们可以在页面中调用全局getApp()方法来获取小程序实例，然后调用我们定义的全局数据和函数。
2 .app.json
App.json可以全局配置小程序。例如，我们可以配置小程序具有哪些页面和窗口形式，设置网络超时，设置多个选项卡，等等。以下是一个简单的配置：
{ ' pages ' :[' page/index/index '，' page/logs/index' ]，' window ' : { ' navigationbartitetext ' : ' Demo ' }，Tabbar ' : { ' list ' :[{ ' page path ' : ' page/index/index '，' text' :' home page'}，{ ' page path ' : ' page/logs/logs '，' text ' 333333 ' '
app.wxss文件很容易理解。它相当于前端的一个全局样式表和css文件。任何页面都可以使用此样式表。当然，如果一个页面重复定义某个属性的表达式形式，就会覆盖app.wxss文件中定义的那个。
以上三个文件中，每个微信小程序都需要app.js和app.json，需要的时候会增加app.wxss。
在图1的文件结构中，也有三个文件夹目录：图像、页面和utils，类似于我们开发中的分包实践(实际上)——带有类型属性的文件或类存储在目录中，便于项目维护。
让我们关注一下pages目录，它存储了applet的所有页面。
这里我们定义了两个页面，索引和日志。如您所见，每个页面中都有app.js和app.json这样的文件。让我们看看它们是什么。以日志页面为例：
1 .logs.js
让我们看看这个文件中的简单代码：
//logs.jsvar util=require('././utils/util . js ')Page({ data : { logs :[]}，onload : function(){ this . setdata({ logs :(wx . getstorageync(' logs ')| |[])。map(function(log){ return util . format time(new Date(log))})})} })如果你有任何开发经验或者js开发经验，可以看到这个类的结构非常简单：1。引入外部文件；2.有一个函数，它是以某种方式处理的。
让我们看看官方文档是如何介绍这个以js结尾的文件的：它包含一个Page()函数，用来注册一个Page。接受一个对象参数，它指定了初始数据、生命周期函数、事件处理函数等。页面的。它是页面逻辑文件，页面逻辑在这里处理。
在这个文件中，我们可以定义变量、函数等等。
2 .logs.json
App.json是小程序的整个配置文件，所以不难理解logs.json是log页面的配置文件，我们可以在这里配置页面标题等属性。
3 .logs.wxml
Wxml文件对于页面是唯一的，相当于接口。它是与用户互动的入口。微信提供了很多基本组件，比如按钮、文字、进度条等，都可以在这个文件中进行配置和显示。
4 .logs.wxss
Wxss和app.wxss文件一样，都是一个样式表文件，但是每个页面下的这个文件都属于某一个页面，而app.wxss是一个全局样式配置。使用相同的属性，logs.wxss将覆盖app.wxss中的文件。
对于页面下的文件配置，我们来看看官方的说明：
摘要
以上是微信小程序的整体项目文件结构。从宏观到具体理解整体框架后，可能更容易一步一步地学习细节。如果你想了解更多关于微信小程序的文章，请继续关注我们。
