第二章 微信小程序开发基础

一、小程序的基本目录结构

    如图所示在微信小程序的基本目录结构中，项目主目录下有2个子目录(pages和utils)和4个文(app.js、app.json、app.wxss和project.config.json)。

    在主目录中，3个以“app”开头的文件是微信小程序框架的主描述文件，是应用程序级别的文件。这3个文件不属于任何页面。

1.主体文件

■appjs小程序逻辑文件

■app.json 小程序公共设置文件

■app.json 小程序公共设置文件

2.页面文件

 ■.js文件 页面逻辑文件

■.wxml文件 页面结构文件

■.wxss文件 页面样式表文件

■.json文件 页面配置文件

二、小程序的开发框架

小程序MINA框架示意图

小程序MINA框架将整个系统划分为视图层和逻辑层。视图层(View)由框架设计的标签语言 WXML(WeiXin Markup Language)和用于描述 WXML组件样式的 wXSS(WeixinStyle Sheets)组成，它们的关系就像HTML和CSS的关系。

2.1视图层

MINA框架的视图层由WXML与WXSS编写，由组件来进行展示。对于微信小程序而言，视图层就是所有.wxml文件与.wxss文件的集合:.wxml文件用于描述页面的结构mxss文件用于描述页面的样式。

2.2逻辑层

(1)增加app()和Page()方法，进行程序和页面的注册。
(2)提供丰富的 API，如扫一扫、支付等微信特有的能力。
(3)每个页面有独立的作用域，并提供模块化能力。

2.3数据层

数据层在逻辑上包括页面临时数据或缓存、文件存储(本地存储)和网络存储与调用

1.页面临时教据或缓存
在Page()中，使用setDaa函数将数据从逻辑层发送到视图层，同时改变对应的tis. data 的值。
setData()函数的参数接收一个对象，以(key,value)的形式表示将key在tis, data中对应的值改变成value。
2.文件存储(本地存储)
使用数据 API接口，如下:
wx.gelStorege 获取本地数据缓
wx.setStorage 设置本地数据缓。
wx.cearStorage 清理本地数据缓
3.网络存储与调用
上传或下载文件AP接口，如下:
wx.request 发起网络请求
wx.uploadFile 上传文件。
wx.do