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 官方文档

相关推荐
hachi031326 分钟前
Vue中input disabled时点击事件不触发怎么办?
javascript·vue.js·ecmascript
BestSongC30 分钟前
基于VUE和FastAPI的行人目标检测系统
vue.js·人工智能·yolo·目标检测·fastapi
起名时在学Aiifox1 小时前
Vue3 + Element Plus 表格排序实战:基于状态字段的智能排序方案
前端·javascript·vue.js·element plus
鹤鸣的日常2 小时前
Vue + element plus 二次封装表格
前端·javascript·vue.js·elementui·typescript
北慕阳2 小时前
速成Vue,自己看
前端·javascript·vue.js
小禾青青3 小时前
我用uniapp开发app用到的uniapp插件
前端·vue.js·uni-app
艾小码3 小时前
为什么你的Vue组件总出bug?可能是少了这份测试指南
前端·vue.js·debug
辞忧*3 小时前
基于element-Plus的el-tooltip封装公共虚拟引用组件
前端·vue.js
by__csdn3 小时前
Electron入门:跨平台桌面开发指南
前端·javascript·vue.js·typescript·electron·html