微信小程序开发之小程序架构的示例分析

  介绍

这篇文章给大家分享的是有关微信小程序开发之小程序架构的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

<强>一、小程序架构

每个小程序的结构都是由两个主要部分构成:<强>主体部分+各个页面

<强>类似于许多框架,主体部分主要用于核心的配置,各个页面主要用于不同业务场景。

<强> 1.1,主体部分主要由3个文件构成

1) app.js:小程序逻辑,初始化应用

2)应用程序。json:小程序配置,比如导航,窗口,页面http请求跳转等

3)应用程序。wxs:公共样式配置

主体配置完成之后,就是对应的业务开发了,也就是开发者最常操作的页面。小程序页面设计基本上也是遵循MVC结构进行构建。

MVC全名是Model  View 控制器,是模型(模型)——视图(视图)-控制器(控制器)的缩写,一种软件设计典范,   用一种业务逻辑,数据,界面显示分离的方法组织代码,将业务逻辑聚集到一个部件里面,   在改进和个性化定制界面及用户交互的同时,不需要重新编写业务逻辑.MVC被独特的发展起来用于映射传统的输入,   处理和输出功能在一个逻辑的图形化用户界面的结构中。

<强> 1.2,页面由4个文件构成

1) js:页面逻辑,相当于控制层(C);也包括部分的数据(M)

2) wxml:页面结构展示,相当于视图层(V)

3) wxs:页面样式表,纯前端,用于辅助wxml展示

4) json:页面配置,配置一些页面展示的数据,充当部分的模型(M)

<>强如图

微信小程序开发之小程序架构的示例分析“> <br/> </p> <p> <强>代码结构参考</强> </p> <p> <强> <img src=

<强>二,<强> <强>配置app.json

简单介绍核心架构配置,详细内容请参考小程序开发文档。

<强>应用程序。json

全局配置页面文件的路径,窗口表现,设置网络超时时间,设置多标签等。

<强>页
接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成

微信小程序开发之小程序架构的示例分析

<强>窗口
用于设置小程序的状态栏,导航条,标题,窗口背景色。

微信小程序开发之小程序架构的示例分析

<强> tabBar

通过tabBar配置项指定标签栏的表现,以及选项卡切换时显示的对应页面。

tabBar配置数组,只能配置最少2个,最多5个标签,标签按数组的顺序排序。

微信小程序开发之小程序架构的示例分析

<强> networkTimeout
可以设置各种网络请求的超时时间。

微信小程序开发之小程序架构的示例分析

<强>调试

真/假

可以在开发者工具中开启调试模式,在开发者工具的控制台面板,调试信息以信息的形式给出,其信息有页面的注册,页面路由,数据更新,事件触发。可以帮助开发者快速定位一些常见的问题。

<强> page.json
每一个小程序页面也可以使用。json文件来对本页面的窗口表现进行配置。页面的配置比应用程序。json全局配置简单得多,只是设置app.json中窗口的配置项的内容,页面中配置项会覆盖app.json的窗口中相同的配置项。

微信小程序开发之小程序架构的示例分析

感谢各位的阅读!关于“微信小程序开发之小程序架构的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

微信小程序开发之小程序架构的示例分析