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

相关推荐
qq_406176141 天前
深入浅出 Pinia:Vue3 时代的状态管理新选择
javascript·vue.js·ecmascript
德育处主任Pro1 天前
前端元素转图片,dom-to-image-more入门教程
前端·javascript·vue.js
前端小超超1 天前
Vue计算属性computed:可写与只读的区别
前端·javascript·vue.js
爱学习的程序媛1 天前
【Web前端】Pinia状态管理详解
前端·vue.js·typescript
java1234_小锋1 天前
分享一套优质的SpringBoot+Vue咖啡商城系统
vue.js·spring boot·咖啡商城
用户336566342171 天前
Vue3+Vite项目极致性能优化:从构建到运行全链路实战指南
vue.js
console.log('npc')1 天前
响应式布局的 Element UI、Ant Design 24栅格布局
vue.js·ui
riyue6661 天前
封装 WebSocket 工具类
网络·vue.js·websocket·网络协议·v
斌味代码1 天前
el-popover跳转页面不隐藏,el-popover销毁
前端·javascript·vue.js