uni-app 内置组件:Label

Label 组件通常用于改进表单组件的可用性,使用户点击标签时,也可以对表单组件进行操作,增加了触摸区域。

API

Label 是一个用来改善用户体验的辅助性组件,通常用于扩大点击区域。

属性

Label 组件的主要属性如下:

  • for:用于绑定控件的 id,当该控件被点击或标记时,与该 label 对应的 form 类型的控件会获得焦点。
  • class:为label自定义样式类。

示例

HTML 部分:

html 复制代码
<view class="form-item">
  <label for="username" class="form-label">用户名:</label>
  <input id="username" type="text" class="form-input" />
</view>

<view class="form-item">
  <label for="password" class="form-label">密码:</label>
  <input id="password" type="password" class="form-input" />
</view>

在这个例子中,点击 用户名:密码: 文本都将使对应的 input 控件获得焦点。

更详细的内容请参考最新的 uni-app 官方文档

相关推荐
深色風信子7 分钟前
Vue 富文本编辑器
前端·javascript·vue.js·wangeditor·vue 富文本·wangeditor-text·前端富文本
程序定小飞26 分钟前
基于SpringBoot+Vue的常规应急物资管理系统的设计与实现
java·开发语言·vue.js·spring boot·后端·spring
我叫张小白。2 小时前
Vue3 Hooks:逻辑复用的解决方案
前端·javascript·vue.js·前端框架·vue
我叫张小白。2 小时前
Vue3 Props 的使用:组件间数据传递的桥梁
前端·javascript·vue.js·vue3
何以解忧,唯有..2 小时前
Vue 列表渲染
前端·javascript·vue.js
前端程序猿i2 小时前
彻底搞懂防抖(Debounce)与节流(Throttle):源码实现与应用场景
开发语言·前端·javascript·vue.js·ecmascript
前端fighter3 小时前
全栈项目:校友论坛系统
vue.js·mongodb·node.js
木易 士心3 小时前
Element UI 多级菜单缩进的动态控制:从原理到工程化实践
前端·vue.js·ui
正在走向自律3 小时前
企业微信消息推送全链路实战:Java后端与Vue前端集成指南
前端·vue.js·企业微信·企业微信消息推送·官方企业微信
lcc1873 小时前
Vue3 CompositionAPI的优势
前端·vue.js