当前位置:首页 > uni-app

uniapp标签有哪些

2026-03-05 10:23:18uni-app

uniapp常用标签

uniapp基于Vue.js开发,支持大部分HTML标签,同时提供了一些跨平台的自定义组件。以下分类列出常用标签:

基础组件

  • <view>:视图容器,类似HTML的<div>
  • <text>:文本组件,类似<span>
  • <image>:图片组件,增强版<img>
  • <button>:按钮组件
  • <input>:输入框
  • <textarea>:多行输入框
  • <scroll-view>:可滚动视图区域

表单组件

  • <checkbox>:复选框
  • <radio>:单选框
  • <picker>:列表选择器
  • <slider>:滑动选择器
  • <switch>:开关选择器
  • <label>:表单标签

导航组件

  • <navigator>:页面链接,类似<a>
  • <uni-nav-bar>:导航栏(需引入uni-ui)

媒体组件

  • <video>:视频播放器
  • <camera>:相机
  • <live-player>:直播播放器
  • <live-pusher>:直播推流

地图组件

  • <map>:地图

其他特殊组件

  • <canvas>:画布
  • <web-view>:网页容器
  • <swiper>:滑块视图容器
  • <icon>:图标
  • <progress>:进度条

平台差异说明

  1. 部分组件在不同平台有不同表现,如<checkbox>在H5端使用原生HTML控件,在小程序端使用自定义组件
  2. 有些组件只在特定平台支持,如<live-pusher>仅在微信小程序和App端支持
  3. 推荐优先使用uniapp提供的跨平台组件,而非直接使用HTML原生标签

扩展组件

通过uni-ui可获取更多高质量组件:

  • <uni-card>:卡片组件
  • <uni-list>:列表组件
  • <uni-grid>:宫格组件
  • <uni-popup>:弹出层组件

注意事项

  1. 组件属性遵循Vue的v-bind语法
  2. 事件处理使用@event绑定
  3. 样式编写支持大部分CSS3特性
  4. 组件层级在某些平台有限制,如微信小程序最多支持18层

uniapp标签有哪些

标签: 标签有哪些
分享给朋友:

相关文章

jquery a标签

jquery a标签

jQuery 操作 <a> 标签的方法 jQuery 提供了多种方法来操作 <a> 标签(超链接),包括修改属性、内容、样式以及绑定事件等。以下是一些常见的操作方式: 修改…

vue标签实现跳转

vue标签实现跳转

vue-router 实现页面跳转 在 Vue 项目中通常使用 vue-router 进行路由跳转管理,以下是常见的实现方式: 声明式导航 <router-link to="/path"…

vue实现多标签

vue实现多标签

Vue 实现多标签页的方法 在 Vue 中实现多标签页功能通常需要结合路由管理和状态管理。以下是几种常见的实现方式: 使用 Vue Router 和动态组件 通过 Vue Router 的路由配置…

vue实现路由标签

vue实现路由标签

路由标签的实现方法 在Vue中实现路由标签通常涉及使用vue-router和动态组件。以下是几种常见的方法: 使用router-link和keep-alive 通过router-link创建导航…

vue标签实现播放文字

vue标签实现播放文字

使用Vue实现文字播放效果 可以通过动态绑定和定时器实现文字逐字播放效果。以下是两种常见实现方式: 方法一:使用v-for和定时器逐字显示 <template> <div>…

vue实现标签选中效果

vue实现标签选中效果

实现标签选中效果的方法 在Vue中实现标签选中效果可以通过多种方式完成,常见的方法包括使用v-model绑定数据、动态类绑定或条件渲染。以下是几种实现方案: 使用v-model绑定单选/多选 对于单…