iis服务器助手广告广告
返回顶部
首页 > 资讯 > 精选 >微信小程序组件列表的示例分析
  • 791
分享到

微信小程序组件列表的示例分析

2023-06-26 08:06:37 791人浏览 薄情痞子
摘要

这篇文章将为大家详细讲解有关微信小程序组件列表的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。基础组件框架为开发者提供了一系列基础组件,开发者可以通过组合这些基础组件进行快速开发。什么是组件:组件

这篇文章将为大家详细讲解有关微信小程序组件列表的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

基础组件


框架开发者提供了一系列基础组件,开发者可以通过组合这些基础组件进行快速开发。

什么是组件:

  • 组件是视图层的基本组成单元。

  • 组件自带一些功能与微信风格的样式。

  • 一个组件通常包括开始标签结束标签属性用来修饰这个组件,内容在两个标签之内。

    <tagname property="value">  Content Goes here ...</tagename>

    注意:所有组件与属性都是小写,以连字符-连接

属性类型


类型描述注解
Boolean布尔值组件写上该属性,不管该属性等于什么,其值都为true,只有组件上没有写该属性时,属性值才为false。如果属性值为变量,变量的值会被转换为Boolean类型
Number数字1, 2.5
String字符串"string"
Array数组[ 1, "string" ]
Object对象{ key: value }
EventHandler事件处理函数名"handlerName"是Page中定义的事件处理函数名
Any任意属性 

共同属性类型


所有组件都有的属性:

属性名类型描述注解
idString组件的唯一标示保持整个页面唯一
classString组件的样式类在对应的wxss中定义的样式类
styleString组件的内联样式可以动态设置的内联样式
hiddenBoolean组件是否显示所有组件默认显示
data-*Any自定义属性组件上触发的事件时,会发送给事件处理函数
bind* / catch*EventHandler组件的事件详见事件

特殊属性


几乎所有组件都有各自定义的属性,可以对该组件的功能或样式进行修饰,请参考各个组件的定义。

组件列表


基础组件分为以下八大类:

视图容器(View Container):

组件名说明
view视图容器
scroll-view可滚动视图容器
swiper可滑动的视图容器

基础内容(Basic Content):

组件名说明
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画布

客服会话:

组件名说明
contact-button进入客服会话按钮

关于“微信小程序组件列表的示例分析”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

--结束END--

本文标题: 微信小程序组件列表的示例分析

本文链接: https://www.lsjlt.com/news/308509.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 微信小程序组件列表的示例分析
    这篇文章将为大家详细讲解有关微信小程序组件列表的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。基础组件框架为开发者提供了一系列基础组件,开发者可以通过组合这些基础组件进行快速开发。什么是组件:组件...
    99+
    2023-06-26
  • 微信小程序组件事件的示例分析
    这篇文章主要介绍了微信小程序组件事件的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。组件事件事件系统是组件间交互的主要形式。自定义组件可以触发任意的事件,引用组件的页...
    99+
    2023-06-26
  • 微信小程序中wxml列表渲染的示例分析
    这篇文章主要介绍微信小程序中wxml列表渲染的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!列表渲染存在的意义以电商为例,我们希望渲染5个商品,而又希望容易改变,我们就要在w...
    99+
    2024-04-02
  • 微信小程序的示例分析
    这篇文章主要介绍微信小程序的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!未来的发展趋势未来的发展趋势是一切触手可及。比如去餐馆吃饭,扫一扫二维码就可以看菜单、点菜、付款;到公交站台,扫一扫二维码就知道有哪些...
    99+
    2023-06-26
  • 微信小程序文件结构的示例分析
    这篇文章主要介绍微信小程序文件结构的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!文件结构小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。一个小程序主体部分由三个文件组成,必须放在项目的...
    99+
    2023-06-26
  • 微信小程序中wx.previewImage的示例分析
    这篇文章主要为大家展示了“微信小程序中wx.previewImage的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“微信小程序中wx.previewIm...
    99+
    2024-04-02
  • 微信小程序虚拟列表的实现示例
    目录前言分析初始渲染方法初步优化进一步优化方法二前言 大部分小程序都会有这样的需求,页面有长列表,需要下拉到底时请求后台数据,一直渲染数据,当数据列表长时,会发现明显的卡顿,页面白...
    99+
    2024-04-02
  • 微信小程序中事件bindtap bindinput的示例分析
    小编给大家分享一下微信小程序中事件bindtap bindinput的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!一、...
    99+
    2024-04-02
  • 微信小程序中冒泡事件的示例分析
    这篇文章主要介绍微信小程序中冒泡事件的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!在微信小程序的事件分为冒泡事件和非冒泡事件:冒泡事件:当一个组件上的事件被触发后,该事件会...
    99+
    2024-04-02
  • 微信小程序WXS模块的示例分析
    这篇文章给大家分享的是有关微信小程序WXS模块的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。WXS 模块WXS 代码可以编写在 wxml 文件中的 <wxs> 标签内,或...
    99+
    2023-06-26
  • 微信小程序中wx.chooseAddress(OBJECT)的示例分析
    这篇文章给大家分享的是有关微信小程序中wx.chooseAddress(OBJECT)的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。1、wx.chooseAddress...
    99+
    2024-04-02
  • 微信小程序云开发的示例分析
    这篇文章主要介绍了微信小程序云开发的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。具体内容如下小程序云开发是微信最近推出的新的一项能...
    99+
    2024-04-02
  • 微信小程序框架wepy的示例分析
    这篇文章将为大家详细讲解有关微信小程序框架wepy的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。wepy框架借鉴了vue的语法风格和功能特性,但是在使用过程中还...
    99+
    2024-04-02
  • 微信小程序商城项目的示例分析
    这篇文章主要为大家展示了“微信小程序商城项目的示例分析”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“微信小程序商城项目的示例分析”这篇文章吧。页面分析:使用fo...
    99+
    2024-04-02
  • 微信小程序开发实践的示例分析
    这篇文章主要介绍了微信小程序开发实践的示例分析,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。小程序由于微信提供了一些组件,在微信中的一些体验确实不错,对于开发来说,由数据驱动...
    99+
    2023-06-26
  • 微信小程序页面路由的示例分析
    这篇文章将为大家详细讲解有关微信小程序页面路由的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。页面路由在小程序中所有页面的路由全部由框架进行管理。页面栈框架以栈的形式维护了当前的所有页面。当发生路...
    99+
    2023-06-26
  • 微信小程序开发中Tabbar的示例分析
    这篇文章将为大家详细讲解有关微信小程序开发中Tabbar的示例分析,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。微信小程序 Tabbar1.下载微信小程序开发软件;htt...
    99+
    2024-04-02
  • 微信小程序实现固定表头、列表格组件
    目录需求:功能点效果图实现思路具体代码(react\taro3.0)具体代码(小程序原生)总结需求: 微信小程序实现固定表头固定列表格组件(移动端做点小修改通用) 功能点 ...
    99+
    2024-04-02
  • 微信小程序兼容方式的示例分析
    这篇文章主要介绍微信小程序兼容方式的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!小程序的功能不断的增加,但是旧版本的微信客户端并不支持新功能,所以在使用这些新能力的时候需要做兼容。文档会在组件,API等页面...
    99+
    2023-06-26
  • 微信小程序中MD5方法的示例分析
    这篇文章给大家分享的是有关微信小程序中MD5方法的示例分析的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。微信小程序 MD5的方法详解生成的文件可以放在  utils文件...
    99+
    2024-04-02
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作