今天下载一个微信的demo，了解一下微信小程序的结构。
我们知道小程序是javascript编写的语言脚本；JS主要用于交互，比如响应用户的点击，获取用户的位置等等。通过编写JS脚本文件来处理用户的操作。
简单来说，WXML决定了那里有什么内容，WXSS决定了内容的样子，JS决定了页面和用户操作的交互。体验好不好就看JS了。
一个小程序文件夹的根目录一般有几个重要的文件。今天主要详细介绍这三个文件:app.jsapp.json和app.wXSS。
首先，我们来看看app.js
App.js作为项目的入口文件，用来创建应用对象。
以下是全局函数app中的结构:
全局数据对象，请注意各种数据组之间用逗号分隔，所有数据都是冒号和花括号的形式；
全局数据:{
routineStyle:'#ffffff '，
uid: null，
openid:' '，
打开的页面:''，
spid:0，
urlImages:“”
},
全局方法，方法1{...},
setBarColor:函数{
var that = this
wx.setNavigationBarColor
},
生命周期方法；
启动时触发{.....}一旦应用程序启动，
当应用程序显示在前台时:onShow{}，
在小程序中，如果要调用公共app js方法，可以在子页面实例化app如var app = getApp
//App function是用来创建应用对象的全局函数。
App{...},
methid1 {...},
//= = = = =生命周期方法= = = = =
//应用程序启动时触发一次
onLaunch{...},
//当应用程序进入前台显示状态时触发
昂秀{...},
//当应用程序进入后台状态时触发
正面{...}
})
# # # # # applet-调用公共js对象方法/app.js
# # #在小程序中，如果要在子页面上调用共工js的方法，需要先在子页面js中实例化app:具体流程如下:子页面js:
//调用公共js对象以调用其方法
var app = getApp//获取应用程序实例
//console.log//可以查看public js的方法
Page//调用public appjs的方法
}
})
我们使用app.json文件对微信小程序进行全局配置，确定页面文件的路径，窗口性能，设置网络超时，设置多个标签页等。
以下是带有所有配置选项的简单配置app.json:
{
"页数":[
"页数/索引/索引"，
"页面/日志/索引"
],
"窗口":{
" navigationBarTitleText ":"演示"
},
" tabBar": {
"列表":[{
" pagePath ":"页面/索引/索引"，
"文本":"主页"
}, {
"页面路径":"页面/日志/日志"，
"文本":"日志"
}]
},
"网络超时":{
【要求】:10000个，
【下载文件】:10000
},
“调试”:真
}
现在我们来逐一分析一下配置项；
我们先来看页数。
他的类型是:字符串数组。他的作用是配置页面路径，这是配置中的必选项；
接受一个数组，每一项都是一个字符串，指定applet由哪些页面组成。每一项代表相应页面的[路径+文件名]信息，
这里应该指出的是:
First:数组的第一项代表applet的初始页面。在applet中添加/减少页面时，需要修改页面数组。
第二，文件名不需要写文件后缀，因为框架会自动找到四个带路径的文件。json，。js，。wxml和。用于集成的wxss。
如果开发目录是:
页数/
pages/index/index.wxml
页面/索引/索引. js
pages/index/index.wxss
pages/logs/logs.wxml
页面/日志/logs.js
app.js
app.json
app.wxss
然后，我们需要在app.json中编写
{
"页数":[
"页数/索引/索引"
"页面/日志/日志"
]
}
窗户
用于设置小程序的状态栏、导航栏、标题和窗口背景颜色。，如“#ff00ff”)
NavigationBarbackGrouncolor hex color # 000000导航栏背景色。
导航栏文本样式字符串白色导航栏标题颜色只支持两种设置:黑/白。
NavigationBarTitleText字符串导航栏标题文本内容
背景颜色hexcolor $ffffff窗口背景颜色
BackgroudTextStyle字符串深色下拉背景字体，加载图的样式，只支持深色/浅色。
启用下拉刷新boolean false是否启用下拉刷新可以在页面上相关事件的处理程序中找到。
注意:navigationStyle打开自定义后只在app.json中起作用，低版本客户端需要兼容。将开发者的基础库版本切割到1.7.0，可以轻松切割到老版本。
标签栏
如果我们的applet是一个多标签应用程序，那么我们可以指定标签栏的性能，以及通过标签栏配置项切换标签时显示的相应页面。
友情提醒:即使在tabBar配置中定义了通过页面跳转或页面重定向到达的页面，底部的tab bar也不会显示。
TabBar是一个数组，只能配置最少2个最多5个选项卡。选项卡按数组的顺序排序。
属性描述:
属性:颜色类型hexColor必需项选项卡上文本的默认颜色
attribute:selected color type hexColor必选项目:选中时选项卡上文本的颜色。
属性:backgroundColor类型hexColor必需选项卡背景色
属性:不需要borderStyle类型字符串。默认值是黑色tabbar上边框的颜色。仅支持黑色/白色。
属性:列表类型:数组的必需页签列表，最少2个，最多5个。
按数组的顺序排序
属性:位置类型:字符串不是必需的。默认值为bottom。可选值:底部和顶部
的属性列表可以接收一个数组，数组中的每一项都是一个对象，其属性值为:
PagePath:必须首先在pages中定义页面路径。
文本:选项卡按钮上的文本
IconPath:图像路径。图标大小限制在40kb，最佳大小为81像素*81像素。
SelectedIconPath:选中时的图像路径。图标大小限制在40kb，最佳大小为81像素*81像素。
注:1。当位置设置为顶部时，图标2将不显示。tabBar中的列表是一个数组，只能配置最少2个选项卡，最多5个选项卡。选项卡按数组顺序排序。
网络超时
您可以设置各种网络请求的超时时间。
属性:不需要请求类型编号。wx.request的超时值，以毫秒60000为单位。
属性:连接套接字类型号不是必需的wx。connectsocket的超时，以毫秒60000为单位。
属性:上传文件类型号不是必需的。wx.uploadFile的超时，以毫秒60000为单位。
属性:不需要下载文件类型号。downloadfile的超时，以毫秒60000为单位。
调试可以在开发工具中启动调试模式。在开发者工具的控制台面板中，调试信息已经以info的形式给出，其信息包括页面注册、页面路由、数据更新和事件触发。可以帮助开发者快速定位一些常见问题。
App.wxss是微信中的一种风格。
全球风格和地方风格
将app.wxss中的样式定义为全局样式，作用于每个页面。页面的wxss文件中定义的样式是一个局部样式，它只在相应的页面上起作用，并将覆盖app.wxss中的同一个选择器
首先，我们先了解一下wxss是什么。WXSS是一组用于描述WXML组件样式的样式语言。
WXSS用于确定应该如何显示WXML的组件。
为了适应广大前端开发者，WXSS拥有CSS的大部分特性。同时，为了更适合开发微信小程序，WXSS对CSS进行了扩展和修改。
与CSS相比，WXSS扩展的特点是:
尺寸单位；风格导入。
首先来看尺寸单位rpx，可以根据屏幕宽度进行适配。指定的屏幕宽度为750rpx。比如iPhone6上，屏幕宽度为375px，有750个物理像素，那么750rpx = 375px = 750个物理像素，1rpx = 0.5px = 1个物理像素。
建议:设计师在开发微信小程序时，可以用iPhone6作为视觉稿的标准。
注意:小一点的屏幕难免会有一些毛边。开发时请尽量避免这种情况。
我们来看看风格导入。
使用@import语句导入外部样式表。@import后面是要导入的外部样式表的相对路径，而
；指示语句的结束。
。小p {
填充:5px
}
@导入“common . wxss”；
。中间p {
填充:15px
}
内嵌样式
在框架上，支持样式和类属性来控制组件的样式。
样式:静态样式是在类中编写的。样式接收动态样式，这些样式将在运行时被解析。请尽量避免将静态样式写入样式，以免影响渲染速度。
类:用于指定样式规则。它的属性值是样式规则中类选择器名称的集合。样式类名不需要用。样式类名由空分隔。
选择器
当前支持的选择器有:
选择器样本样本描述
。class.intro选择所有拥有的组件。
#id#firstname选择id="firstname "的组件
Elementview选择所有视图组件。
元素，元素视图，复选框选择所有文档的视图组件和所有复选框组件。
* after view::after在视图组件后插入内容。
* before view::before在视图组件前面插入内容。
今天到此为止。明天，我们将把这些属性放到一个例子中来实际观察一下。请继续关注:
