微信小程序wxm标签-微信小程序开发(七)-WXM组件(标签)-wxm文件-小程序标签-即速应用

微信小程序wxm标签-微信小程序开发(七)-WXM组件(标签)-wxm文件-小程序标签

浏览量：1836 时间：2020-03-20 来源：lendq

基础组件
1.框架为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行快速开发。本质上和html标签类似
2.组件是视图层的基本组成单元。组件自带一些功能与微信风格的样式。一个组件通常包括开始标签和结束标签，属性用来修饰这个组件，内容在两个标签之内。
注意：所有组件与属性都是小写，连字符为-连接属性类型类型描述注解Boolean布尔值组件写上该属性，不管该属性等于什么，其值都为true，只有组件上没有写该属性时，属性值才为false。如果属性值为变量，变量的值会被转换为Boolean类型Number数字1,2.5String字符串“string”Array数组[1,“string”]Object对象{key:value}EventHandler事件处理函数名“handlerName”是Page中定义的事件处理函数名Any任意属性共有属性类型
3.所有组件都有的属性：
属性名类型描述注解idString组件的唯一标示保持整个页面唯一classString组件的样式类在对应的WXSS中定义的样式类styleString组件的内联样式可以动态设置的内联样式hiddenBoolean组件是否显示所有组件默认显示data-*Any自定义属性组件上触发的事件时，会发送给事件处理函数bind*/catch*EventHandler组件的事件详见事件特殊属性
4.几乎所有组件都有各自定义的属性，可以对该组件的功能或样式进行修饰，请参考各个组件的定义。
组件列表
5.基础组件分为以下七大类：
视图容器(ViewContainer)：组件名说明view视图容器scroll-view可滚动视图容器swiper滑块视图容器基础内容(BasicContent)：组件名说明icon图标text文字progress进度条表单(Form)：标签名说明button按钮form表单input输入框checkbox多项选择器radio单项选择器picker列表选择器picker-view内嵌列表选择器slider滚动选择器switch开关选择器label标签导航(Navigation)：组件名说明navigator应用链接多媒体(Media)：组件名说明audio音频image图片video视频地图(Map)：组件名说明map地图画布(Canvas)：组件名说明canvas画布页面逻辑
6.在wxml中会使用{{}}来实行页面逻辑,不再使用DOMAPI操控遵循MVVM开发模式,把渲染和逻辑分离
7.简单来说就是不要再让JS直接操控DOM，JS只需要管理状态即可，然后再通过一种模板语法来描述状态和界面结构的关系即可。
数据绑定
8.通过{{}}的语法把一个变量绑定到界面上
控制绑定
9.仅仅通过数据绑定还不够完整的描述状态和界面的关系，还需要if/else,for等控制能力，在小程序里边，这些控制能力都用wx:开头的属性来表达。