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

相关推荐
tzy2331 小时前
Vue和React之争
前端·vue.js·react.js
网络点点滴1 小时前
Vue3中toRaw和MarkRaw
前端·javascript·vue.js
AI服务老曹2 小时前
掌握核心代码:基于 Spring Boot + Vue 的 AI 视频管理平台源码架构与二次开发实战(全开源/低代码/私有化)
vue.js·人工智能·spring boot
蜡台3 小时前
Vue 组件通信的 12 种解决方案
前端·javascript·vue.js·props
YAY_tyy7 小时前
Vue3 + Three.js 实战:自定义 3D 模型加载与交互全流程
前端·javascript·vue.js·threejs
2301_7806698614 小时前
前端logo替换开发
前端·vue.js
代码煮茶18 小时前
Vue3 路由实战 | Vue Router 从 0 到 1 搭建权限管理系统
前端·javascript·vue.js
华洛19 小时前
聊聊我逃离前端开发前的思考
前端·javascript·vue.js
pacong20 小时前
vscode使用
javascript·vue.js·vscode
北海军21 小时前
render el-select下拉框
前端·javascript·vue.js