零基础学做网站培训介绍

当前位置:

什么是WXML

以下为学做网站论坛关于“什么是WXML”讲解视频教程。

微信小程序每一个页面都会有四个文件,别是wxml wxss js json,WXML是微信小程序前端页面,它是由标签语言编写而成。

WXML(WeiXin Markup Language)是微信的一套标签语言,结合基础组件、事件系统,可以构建出页面的结构。基础组件类似HTML中的标签,事件系统是JavaScript中的事件,可处理逻辑反应到界面上;
wxml只是一个文件格式,如果没有组件和事件它没任意用处,又如果把组件、事件写在txt文档里面也没任意用处,所以没有谁更厉害,相辅相成的关系。
作为一种标签语言,wxml同样通过使用标记标签来描述页面结构,页面内容写在标签内部,标签由尖括号包围的关键词构成,具体来说,可以分为两类。
 

第一种是成对出现的标签,即有开始标签和结束标签,内容部分写在两个标签之间,基本结构为:<关键词></关键词>例如小程序中特别常用的view组件的写法就是这样。
第二种是不成对出现的,使用时只有一个标签存在,基本结构为:<关键词/>,这种标签因为表示的含义使得他们不需要结束标签进行标识,例如我们常见的输入框,只需要一个标签就可以确定这个组件了,程序在编译过程中见到这个标签就会在对应位置添加输入框,而view作为视图容器,内部能够放置其他组件,就需要有开头和结尾进行标识。

在上面这张图片的例子中,代码第一行是注释,注释的格式是尖括号加感叹号加两个连字符开头,中间为注释内容,结尾为两个连字符加尖括号,在编译器中,我们使用ctrl加右斜杠/就可以实现对光标所在行或者所选代码的注释。
第二行为view,可以看到标签是成对出现的,这里的view实际上就是一个箱子,它能够作为一个或多个元素的容器使用。为了使大家在左侧模拟器中能够看到效果,我给view设定了长度和高度以及颜色三种样式。第三行和第四行,我写了两个输入组件,使用该input组件就可以在页面上完成左图所示的输入功能。那么对于input来说,其也可以成对标签的样子,两种写法都是可以的,但是大家一定要注意右斜杠的位置,避免出错。

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 什么是WXML 图文教程 (11851 次浏览)
    微信小程序每一个页面都会有四个文件,别是wxml wxss js json,WXML是微信小程序前端页面,它是由标签语言编写而成。WXML(WeiXin Markup Language