微信小程序页面开发（微信小程序开发教程手册）

wxml（微信标记语言）是一套由框架设计的标签语言。 结合基本组件和事件系统，您可以构建页面的结构。

我认为WXML可以从三个方面来介绍：垂直处理、水平处理、逻辑处理。 我在这里简单介绍一下。 这些也是开发小程序的基础。 您可以根据需要使用这些文档。 稍后我会介绍他们。 未来还会扩展具体功能。

垂直

垂直：组件的组合，包括系统组件、第三方组件、自定义组件。

示例：

用户名

系统组件：

查看容器： cover-image、cover-view、movable-area、movable-view、scroll-view、swiper、swiper-item、view

基本内容：图标、进度、rich-文本、文本

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

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

媒体组件：音频、相机、图像、直播-播放器、直播-推杆、视频

地图：地图

画布：画布

开放功能：广告、官方- ]帐户、打开-数据、网络-视图

原生组件描述：原生-组件

辅助功能：aria-组件

导航栏：Navigation-bar

页面属性配置节点：page-meta

具体使用参考： https://developers.weixin.qq.com/miniprogram/dev/component/native-component.html

第三方组件：WeUI组件库等。

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

水平

水平：组件属性

属性名称描述ID唯一标识类样式表样式 内联样式 隐藏 隐藏数据-* 事件转发 数据绑定* /catch* 组件事件

逻辑处理

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

数据绑定

{{ message}} // page.jsPage({ data: { 消息: "你好，米娜！")

渲染列表

{{item}} // page.jsPage({ data: { array: [1, 2, 3, 4, 5] }})

条件 渲染

WEBVIEW 应用 米娜 // page.jsPage({ data: { view: 'MINA' }})

用于包装视图组件的块

如果要使用 wx:for 和 wx:if 渲染视图容器，可以执行以下操作：能。 使用块标签换行。 块标签不是组件，它们只是用于包装的元素，它们不被渲染，并且只接受 wx:.. 控制属性。

块和 wx:if:

view1 view2

块和 wx:for:

<view&g{{index}}: {{item}}

推荐教程：“微信小程序”

下载微信应用

微信是移动端支持通过手机网络发送语音消息、视频、照片和文本的通讯软件。 微信带来了全新的移动通信体验，您可以单独或群组聊天，还可以根据您的地理位置查找附近的人。 有需要的朋友，请快来保存您的下载体验吧！

这几篇文章你可能也喜欢：

• 微信小程序购物车功能的实现（微信小程序开发购物车支付）
• 一个邮箱可以包含多个微信小程序（一个邮箱可以包含多个微信小程序账号）
• 如何使用小程序画布绘制二维码（如何使用小程序画布绘制二维码）
• 如何使用Taro + Vue3开发小程序（练习）
• 我们简单分析一下如何从小程序跳转到H5页面。 （分析示例）（小程序可以跳转网页吗？）

本文由主机参考刊发，转载请注明：微信小程序页面开发（微信小程序开发教程手册） https://zhujicankao.com/142376.html