SEARCH
微信小程序页面结构文件(WXML)解读

微信小程序页面结构文件(WXML)解读

系统介绍

微信小程序页面结构文件(WXML)解读

WXML (WeiXin Markup Language)是框架设计的一套标记语言,用于渲染界面,WXML的渲染原理和React Native思路一致,通过一套标记语言,在不同平台被解析为不同端的渲染文件,如图所示。
咨询热线: 13021687575

功能列表

WXML (WeiXin Markup Language)是框架设计的一套标记语言,用于渲染界面,WXML的渲染原理和React Native思路一致,通过一套标记语言,在不同平台被解析为不同端的渲染文件,如图所示。


 

界面渲染示意图


从图中我们能看出,WXML语言最终会转译为宿主端对应的语言,所以WXML中所使用的标签一定是小程序定义的标签,不能使用自定义标签,这样才能保证页面能被正确转译。使用微信开发者工具开发时,在WXML中编写一些HTML标签或自定义标签仍然会被正常解析,这会给开发者造成一种小程序能直接支持HTML标签的误解。这是因为微信开发者工具内核是浏览器内核,同时小程序框架并没对WXML中的标签和WXSS中的内容进行强验证,所以HTMLCSS能直接被解析,但这种不合法的WXML在手机端微信中是不能正常显示的。开发过程中我们一定要拿真机进行测试,保证程序能正常运行。

WXML具有数据绑定、列表渲染、条件渲染、模板、事件等能力。

 

数据绑定

小程序中页面渲染时,框架会将WXML文件同对应Pagedata进行绑定,在页面中我们可以直接使用data中的属性。小程序的数据绑定使用Mustache语法(双大括号)将变量或简单的运算规则包起来,主要有以下几种渲染方式。


简单绑定是指我们使用Mustache语法(双大括号)将变量包起来,在模板中直接作为字符串输出使用,可作用于内容、组件属性、控制属性、关键字等输出,其中关键字输出是指将JavaScript中的关键字按其真值输出。

 

 




您当前浏览的文章:《微信小程序页面结构文件(WXML)解读》由小程序开发服务品牌九尾狐整理发布。
转载请注明:http://www.webs8.cn/index.php/shows/6/19.html
文章标签:
...

点这里快速联系客服!

企业简介

青岛九尾狐科技是专业微信小程序、APP定制开发服务商。依托自身在云计算、大数据和人工智能、物联网方面技术优势,九尾狐深耕医疗、金融科技、法律、高端制造、高端服务等行业领域,打造“互联网+行业”移动应用工具,与合作伙伴共建行业互联网营销生态圈。

联系我们

服务热线:130-2168-7575

公司名称:青岛九尾狐网络科技有限公司

公司网址:http://www.webs8.cn

公司地址:
山东省青岛市市北区哈尔滨路62号青建太阳岛商务2号楼512

加微信咨询

在线客服