宁波小程序开发_宁波软件开发_宁波网络公司【昱远信息】 15058005455
微信小程序制作开发: 微信小程序开发框架(MINA),框架及优点框架|昱远信息系统开发

详解微信小程序开发框架(MINA)

更新时间:2019 年 5 月 17 日 08:44:44 作者:IDreamo

小程序采用MINA框架,旨在让开发者在微信中以简单高效的方式开发具有原生App体验的服务。本文主要介绍微信小程序开发框架(MINA),有需要的朋友可以参考以下

小程序MINA框架及其优势

MINA 框架:

小程序采用MINA框架,旨在让开发者在微信中以简单高效的方式开发具有原生App体验的服务。

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

整个系统分为视图层(视图,描述语言wxml和wxss)和逻辑层(App Serice app软件开发 ,基于JavaScript)两部分。这使得保持数据和视图同步变得非常容易。当数据被修改时,只需要在逻辑层改变数据微信小程序制作开发,视图层就会响应更新。开发者只需要将页面路由、方法、生命周期函数注册到框架中,其他复杂的操作都由框架来处理。

小程序的优点:

• 易于使用:无需下载,打开即可使用,完成后即可使用。不占用手机内存,节省流量,节省安装时间

• 简单的开发:开发的本质是在MVVM风格的Javascript框架上开发的。有前端经验的程序员可以无缝对接,没有经验的“小白”也可以快速上手。

微信小程序制作开发_微信小程序怎么制作自己的程序_微信小程序用什么开发

• 跨平台操作:无需单独开发IOS和Android版本,只需发布​​微信小程序平台,所有平台均可使用。开发成本低

• 快速分发和迭代:无需担心各种发布渠道,无需担心与旧版本升级的兼容性问题。

开启速度比H5更快,体验接近原生APP

小程序开发框架的目标是让开发者在微信中以最简单、最高效的方式开发具有原生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中的数据发生变化时,会主动触发相应页面组件的重新渲染。

框架的核心是一个响应式数据绑定系统,可以轻松保持数据和视图同步。只需要修改逻辑层的数据,视图层就会相应更新。这是一个例子:

 

 欢迎使用{{appname}}
 

//AppService应用逻辑层代码
//初始数据
page({
 data:{
  appname:'易投票'
 },
 changeAppname:function(e){
  this.setData({
  appname:'我的小程序'
 })
 }
})

图 1:初始名称

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

示例中的数据如何更新?首先,开发者通过框架将AppService应用逻辑层数据中的appname绑定到页面视图层中名为appname的变化。页面刚打开时会显示“Welcome to Easy Voting。然后,当点击按钮替换Name”时,视图层会将changeAppname的点击事件发送给逻辑层,逻辑层会找到事件函数 changeAppname。最后,逻辑层changeAppname函数进行setData操作,将对象appname的值改为“我的小程序”,因为该对象已经绑定在视图层,所以视图层会显示图2中的名称。

小程序的MINA框架运行速度接近原生应用。在框架层面做了很多优化,对重功能(页面或标签切换、多媒体、网络连接等)使用接近原生的组件继承。它为 Android 和 iOS 提供了高度一致的演示,以及几乎完整的开发和调试工具。

目录结构

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

微信小程序用什么开发_微信小程序怎么制作自己的程序_微信小程序制作开发

逻辑层

小程序的逻辑层是所有 .js 脚本文件的集合。小程序在逻辑层处理数据并发送给视图层微信小程序制作开发,并接受视图层发回的事件请求。

MINA 框架的逻辑层是用 JavaScript 编写的。基于此,微信团队进行了一些优化,以更高效地开发小程序。这些优化包括:

1、添加app方法注册程序和page方法注册页面;

2、提供丰富的API接口;

3、页面范围相对独立,具有模块化能力;

简单总结一下,逻辑层就是每个页面的.js脚本文件。

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

查看图层

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

微信小程序用什么开发_微信小程序制作开发_微信小程序怎么制作自己的程序

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

数据层

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

1、页面临时数据或缓存

在页面page()中,我们需要使用setData函数将数据从逻辑层发送到视图层,同时改变this.data的对应值。这一般是指小程序中的调用页面,一般是指调用方法时包含它的函数被调用到的对象。直接修改this.data无效,不能改变页面状态,会导致数据不一致。一次设置的数据有大小限制,不能超过1024KB,以免一次设置太多数据。

setData() 函数的参数接受一个对象。以key和value的形式,将this.data中key对应的value改为value。 key可以很灵活,包括以数据路径的形式表示,比如array[0].title,不需要在this.data中预定义。

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

使用微信提供的现成数据API接口,如:

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

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

wx.clearStorage:清除本地数据缓存

微信小程序怎么制作自己的程序_微信小程序制作开发_微信小程序用什么开发

3、网络存储与调用

上传或下载文件的API接口,如:

wx.request:发起网络请求

wx.uploadFile:上传文件

wx.downloadFile:下载文件

调用URL的API接口如下:

wx.navigateTo:保留当前页面,跳转到应用中的某个页面。但是不能跳转到tabbar页面。您可以返回原始页面。

wx.redirectTo:关闭当前页面,跳转到应用中的某个页面。但是不允许跳转到tabbar页面。您无法返回原始页面。

以上是微信小程序框架的相关说明。微信团队一直在不断优化框架能力 百度小程序开发 ,及时关注小程序开发官方用户文档,了解小程序最新能力和优化点。

总结

以上是小编介绍的微信小程序开发框架(MINA)。我希望它对你有帮助。有任何问题请给我留言,小编会及时回复你的。非常感谢您对 Scripting House 网站的支持!

如果您觉得本文对您有帮助,请转载,请注明出处,谢谢!

【昱远信息系统定制开发】

返回列表

相关动态