小程序的MINA框架及其优势

MINA框架：

Applet使用MINA框架，旨在让开发者以简单高效的方式在微信中开发具有原生应用体验的服务。

MINA的核心是一个响应的数据绑定系统。

整个系统分为两个部分：视图层(wxml和wxss)和逻辑层(App Serice，基于JavaScript)。这使得保持数据与视图同步变得非常简单。当数据被修改时，逻辑层中只需要修改数据，视图层会相应更新。开发人员只需要将页面路由、方法和生命周期函数注册到框架中，所有其他复杂的操作都将由框架处理。

小程序的优点：

使用方便：无需下载、打开使用，使用后即离开。它不占用手机内存，节省流量和安装时间。开发很简单：开发的本质是MVVM风格的Javascript框架。有前端经验的程序员可以无缝连接，没有经验的“小白”也可以快速上手。跨平台运行：不需要单独开发IOS和Andriod版本，只需发布微信小程序平台，所有平台都可以使用。开发成本低，发行迭代快：不用关心各种发行渠道，不用担心升级老版本的兼容性。

开通速度比H5快，体验接近原生APP

APPlet开发框架的目标是让开发者能够以简单高效的方式在微信中开发具有原生app体验的服务。

微信团队为小程序提供的框架名为MINA。MINA框架通过封装微信客户端提供的文件系统、网络通信、任务管理、数据安全等基础功能，为上层提供了一套完整的JavaScript API，方便开发者使用微信客户端提供的各种基础功能和能力，快速搭建应用。

MINA框架

微信小程序的框架图如下：

MINA框架主要分为两部分：

第一部分是页面视图层。开发人员使用WXML文件来构建页面的基本视图结构(WXML是一种类似于HTML标签和一系列基本组件的语言)，并使用WXSS文件来控制页面的呈现风格。

第二部分AppService应用逻辑层，是MINA框架的服务中心，通过微信客户端启动异步线程独立加载运行，实现页面渲染所需的数据和页面交互处理逻辑。MINA框架中的AppService使用JavaScript编写交互逻辑、网络请求和数据处理，但不能使用JavaScript中的DOM操作。小程序中的每个页面都可以通过AppService实现数据管理、网络通信、生命周期管理和页面路由。

MINA框架为页面组件(如bindtap、bindtouchstart等)提供了一系列与事件监控相关的属性。)，与AppService中的事件处理函数绑定，实现用户交互数据从页面到AppService层的同步。同时，MINA框架提供了很多方法，可以将AppService中的数据单向绑定到页面上(注意数据的绑定方向是单向的)。当AppService中的数据发生变化时，它会主动触发相应页面组件的重新呈现。

该框架的核心是一个响应的数据绑定系统，可以轻松地保持数据和视图的同步。只需修改逻辑层中的数据，视图层就会相应更新。例子如下：

！-page view layer code-view class=' apptitle ' text class=' app-avatar '欢迎使用{ { appname } }/text button bind tap=' change appname '更改名称/button/view//AppService应用程序逻辑层code//Initial data page({ data : { appname : '便于投票' })，更改appname3360函数(e) {this。setdata ({appname3360 '我的小程序' })})

图1:初始名称

图2:点击“更改名称”按钮后

示例中的数据是如何更新的？首先，开发人员通过框架将AppService的应用逻辑层数据中的appname与页面视图层名称appname的变化进行绑定。当页面刚打开时，会显示“欢迎轻松投票。然后点击“更改名称”按钮后，视图层会将changeAppname的tap事件发送到逻辑层，逻辑层会找到事件函数changeAppname。最后，逻辑层changeAppname函数执行setData操作，将对象Appname的值改为“我的小程序”。因为对象已经绑定在视图层中，所以视图层将显示为图2中的名称。

Applet的MINA框架运行速度接近原生app，在框架层面进行了大量优化。在繁重的功能方面(页面或选项卡切换、多媒体、网络连接等)。)，它使用了接近原生的组件继承，并对安卓和ios做了高度一致的呈现，以及近乎完整的开发和调试工具。

目录结构

典型的applet目录结构非常简单。通常，一个项目包含两个目录(页面和utils)和三个文件(app.js、app.json、app.wxss)。Pages目录包括程序所需的所有页面，一个页面对应一个目录，包含2到4个文件(。js，wxml，json和。wxss)。utils目录包含一些公共js代码文件。当然，我们也可以添加其他公共目录，例如用于存储本地图像资源的images目录。

逻辑层

小程序的逻辑层是所有的集合。js脚本文件。applet处理逻辑层中的数据并将其发送到视图层，并接受视图层发回的事件请求。

MINA框架的逻辑层是由JavaScript编写的。在此基础上，微信团队做了一些优化，让小程序开发更高效。这些优化包括：

1.添加app方法注册程序，添加page方法注册页面；

2.提供丰富的API接口；

3.页面的范围相对独立，具有模块化的能力；

简而言之，逻辑层是。每页的js脚本文件。

需要注意的是，小程序的逻辑层是用js编写的，但是并没有在浏览器中运行，所以Web中JavaScript的一些功能无法使用，比如dom、window等。这也是开发过程中需要克服的障碍。

视图层

对于微信小程序来说，视图层是所有的集合。wxml(微信标记语言)文件和。wxss(微信样式表)文件：wxml用于描述页面结构。wxss用于描述页面样式。

视图层以给定的样式呈现数据，并将事件反馈给逻辑层，而数据呈现由组件执行。组件是视图的基本单元。

数据层

数据层包括临时数据或缓存、文件存储、网络存储和调用。

1.页面临时数据或缓存

在page page page()中，我们使用setData函数将数据从逻辑层发送到视图层，并更改this.data的对应值，这一般指小程序中的调用页，广泛指包含它的函数作为方法调用时所属的对象。直接修改this.data是无效的，不能改变页面的状态，也会造成数据不一致。数据设置一次有大小限制，不能超过1024KB，避免一次设置太多数据。

函数的参数接受一个对象。以键和值的形式，将this.data中与键对应的值更改为值。键可以非常灵活，包括以数据路径的形式表示，如数组[0]。标题，不需要在此. data中预先定义。

2.文件存储(本地存储)

使用微信提供的现成数据API接口，如：

Wx.getStorage:获取本地数据缓存

Wx.setStorage:设置本地数据缓存

清理本地数据缓存

3.网络存储和呼叫

用于上传或下载文件的应用编程接口，例如：

Wx.request:发起网络请求

Wx.uploadFile:上传文件

下载文件：下载文件

调用网址的API接口如下：

Wx.navigateTo:保留当前页面并跳转到应用程序中的一个页面。但是你不能跳到tabbar页面。您可以返回到原始页面。

Wx.redirectTo:关闭当前页面并跳转到应用程序中的一个页面。但是，不允许跳转到tabbar页面。您无法返回到原始页面。

以上是微信小程序框架的描述。微信团队一直在不断优化框架能力，及时关注官方小程序开发者文档，了解小程序的最新能力和优化点。

摘要

以上是边肖介绍的微信小程序开发框架(MINA)，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！如果你觉得这篇文章对你有帮助，请转载，请注明出处，谢谢！