微信小程序_基础组件大全

微信小程序_基础组件

微信小程序为小程序开发者提供了一系列小程序基础组件,开发者可以通过组合这些小程序基础组件进行微信小程序的快速开发。

微信小程序组件是什么?微信小程序组件怎么用?

小程序组件是视图层的基本组成单元。
小程序组件自带一些功能与微信风格的样式。
一个小程序组件通常包括开始标签和结束标签,属性用来修饰这个组件,内容在两个标签之内。

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

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

一、微信小程序_属性类型

二、微信小程序_共同属性类型

三、微信小程序_特殊属性
几乎所有组件都有各自定义的属性,可以对该组件的功能或样式进行修饰,请参考各个组件的定义。

四、微信小程序_组件列表
微信小程序基础组件分为以下八大类:

小程序视图容器(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 进入客服会话按钮

原文地址:https://www.cnblogs.com/lanshu/p/9946736.html

时间: 2024-10-08 14:59:11

微信小程序_基础组件大全的相关文章

微信小程序_小程序开发框架

微信小程序_小程序开发框架 微信小程序小程序开发框架的目标是通过尽可能简单.高效的方式让开发者可以在微信中开发具有原生APP体验的服务. 框架提供了自己的视图层描述语言WXML和WXSS,以及基于JavaScript的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,可以让开发者可以方便的聚焦于数据与逻辑上. 响应的数据绑定微信小程序框架的核心是一个响应的数据绑定系统. 整个系统分为两块视图层(View)和逻辑层(App Service) 框架可以让数据与视图非常简单地保持同步.当做数据

微信小程序实例源码大全

怎么本地测试微信小程序实例源码 1.下载源码 2.打开微信开发者工具 3.添加项目->选择本项目目录->编译执行 微信小程序实例源码大全 微信小程序游戏类demo:识色:从相似颜色中挑选不同的一个 源码链接:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=1105 微信小程序精品demo:仿网易云音乐:歌单,FM,播放,评论 源码链接:http://www.wxapp-union.com/forum.php?mod=vie

微信小程序源码案例大全

微信小程序demo:足球,赛事分析 小程序简易导航 小程序demo:办公审批 小程序Demo:电魔方 小程序demo:借阅伴侣 微信小程序demo:投票 微信小程序demo:健康生活 小程序demo:文章列表demo 微商城(含微信小程序)完整源码+配置指南 微信小程序Demo:一个简单的工作系统 微信小程序Demo:用于聚会的小程序 微信小程序Demo:Growth 是一款专注于Web开发者成长的应用,- 微信小程序Demo: Music-Player 微信小程序Demo:团贷网(投资) 微信

微信小程序实例源码大全2

wx-gesture-lock  微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 shitoujiandaobu 小程序:石头剪刀布(附代码说明) audiodemo 微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义 star 微信小程序开发之五星评分 switchCity 微信小程序开发之城市选择器 城市切换 huadong_del  微信小程序滑动删除效果 jianh

微信小程序实例源码大全demo下载

怎么本地测试微信小程序实例源码 1.下载源码 2.打开微信开发者工具 3.添加项目->选择本项目目录->编译执行 微信小程序实例源码大全 微信小程序游戏类demo:识色:从相似颜色中挑选不同的一个 源码链接:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=1105 微信小程序精品demo:仿网易云音乐:歌单,FM,播放,评论 源码链接:http://www.wxapp-union.com/forum.php?mod=vie

「小程序JAVA实战」小程序的基础组件(24)

转自:https://idig8.com/2018/08/12/xiaochengxu-chuji-24/ 来说下 ,小程序的基础组件.源码:https://github.com/limingios/wxProgram.git 中的No.11 基础组件 icon图标组件 rich-text 富文本组件 text 文本组件 progress 进度条组件 icon图标组件 官方介绍>https://developers.weixin.qq.com/miniprogram/dev/component/

微信小程序导入Vant-Weapp组件库及出错处理

微信小程序导入Vant-Weapp组件库及出错处理一.下载Node.js*链接:https://nodejs.org/en/推荐选择LST的8.0以上版本,下载安装即可,安装完成后可以进行验证cmd打开终端,输入vant-v出现对应版本即为安装成功,也可输入npm -v查看对应的npm版本 二.在微信开发工具做对应操作 链接:https://youzan.github.io/vant-weapp/#/intro 后续可根据开发指南进行操作 三.安装Vant组件库选中miniprogram文件,右

微信小程序开发基础知识总结

微信小程序在无论在功能.文档及相关支持方面,都是优于前面几种微信账号类型,它提供了很多原生程序才有的接口,使得我们的小程序在很多方面突破H5页面应用的限制,更加接近原生程序的功能,因此微信小程序具有很大的前景想象力.它提供了自己的视图层描述语言 WXML 和 WXSS,以及基于 JavaScript 的逻辑层框架,并在视图层与逻辑层间提供了数据传输和事件系统,可以让开发者可以方便的聚焦于数据与逻辑上. 1.小程序的目录结构 小程序的目录结构如下所示. 其中项目级别的的文件包括 app.js.ap

微信小程序wx.request组件的那些坑

最近在做一个教育的在线发布系统,打算用微信小程序做前端,后端用php的CI框架,这两天把CI框架的基本功能已经啃完,因为手册比较完善,所以按照逻辑走一边就通了. 反观微信小程序,帮助代码不多,对于一些没接触过前端和js开发的新手来说,很多流程和细节都会拿不准. 1.这两天遇到最大的困扰就是wx.request组件如何从php服务器端取回数据并显示在小程序界面上,这里涉及到一个通信, 因为小程序目前的机构和框架都是基于ajax异步交互的基础上的,所以要懂得小程序的数据读写功能,首先要了解ajax的