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

相关推荐
页面魔术1 分钟前
⭐看完vite纪录片才知道尤大有多屌(上)
前端·javascript·vue.js
AI_567843 分钟前
Vue3组件通信的实战指南
前端·javascript·vue.js
烤麻辣烫43 分钟前
黑马大事件学习-16 (前端主页面)
前端·css·vue.js·学习
滿1 小时前
Vue3 ElementPlus el-select 焦点事件数据不回显问题
javascript·vue.js·elementui
代码or搬砖1 小时前
Vue生命周期总结(四个阶段,八个钩子函数)
前端·javascript·vue.js
VX:Fegn08951 小时前
计算机毕业设计|基于springboot + vue超市管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
鹏北海-RemHusband1 小时前
记录一次微前端改造:把 10+ 个独立 Vue 项目整合到一起
前端·javascript·vue.js
小圣贤君1 小时前
从零到一:打造专业级小说地图设计工具的技术实践
vue.js·electron·写作·canvas·小说·小说地图
宁雨桥1 小时前
前端跨页面通信:从基础到工程化的全面指南
前端·vue.js·react.js
源码获取_wx:Fegn089511 小时前
基于springboot + vue健身房管理系统
java·开发语言·前端·vue.js·spring boot·后端·spring