微信小程序开发|页面文件wxml

WXML（WeiXin Markup Language）是由该框架设计的一组标记语言。结合基本组件和事件系统，可以构建页面结构。

我认为WXML是通过三个维度引入的：垂直、水平和逻辑处理。下面是一个简短的介绍。它们也是开发小程序的基础。必要时，可根据文件使用。稍后，当引入特定功能时，可以对其进行扩展。

肖像

垂直：组件的组合，包括系统组件、第三方组件和用户定义的组件

例如：

<；/图像>

用户名</text>

系统组件：

查看容器：封面图像、封面视图、可移动区域、可移动视图、滚动视图、滑动器、滑动项目、视图

基本内容：图标、进度、富文本、文本

表单组件：按钮、复选框、复选框组、编辑器、表单、输入、标签、选择器、选择器视图、选择器视图列、单选框、单选组、滑块、开关、文本区

导航：功能页面导航器、导航器

媒体组件：音频、摄像机、图像、现场播放器、现场暂停、视频

地图：地图

帆布

开放性：广告、公众号、开放数据、网络视图

本机组件描述：本机组件

可访问：aria组件

导航栏：导航栏

页面属性配置节点：页面元

具体参考：

第三方组件：如WeUI组件库

自定义组件：自定义组件有自己的wxml模板和wxss样式

横向

横向：构件的特性

属性名称

描述

身份证件

唯一标识

班

样式表

风格

内联样式

隐藏的

隐藏

数据-*

事件传输数据

绑定*/catch*

组件事件

逻辑处理

逻辑处理：根据绑定的数据决定如何显示视图

数据绑定

｛｛message｝｝

//页面.js

第页({

数据：{

留言：“MINA你好！”

}

})

列表呈现

{｛item｝

//页面.js

第页({

数据：{

数组：[1，2，3，4，5]

}

})

条件渲染

WEBVIEW

APP

MINA

//页面.js

第页({

数据：{

视图：“MINA”

}

})

用于包裹视图组件的块

如果wx:for和wx:要渲染视图容器，可以使用块标记将其包装。块标记不是组件，而是用于包装的元素。它不会被渲染，只接受wx:..Control属性。

块和wx：如果：

<块wx:if=“｛｛true｝｝”>

view1

view2

块和wx：用于：

<块wx:for=“｛｛[1，2，3]｝｝”>

｛｛index｝｝：

｛｛item｝｝

参考资源：

巧智科技：科技成就梦想！专注于广州、深圳和惠州的小程序、APPapp、网站和区块链钱包的定制开发！