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

相关推荐
东东5163 小时前
智能社区管理系统的设计与实现ssm+vue
前端·javascript·vue.js·毕业设计·毕设
晓晓莺歌6 小时前
vue3某一个路由切换,导致所有路由页面均变成空白页
前端·vue.js
web打印社区11 小时前
web-print-pdf:突破浏览器限制,实现专业级Web静默打印
前端·javascript·vue.js·electron·html
Amumu1213811 小时前
Vuex介绍
前端·javascript·vue.js
css趣多多12 小时前
Vue过滤器
前端·javascript·vue.js
这是个栗子14 小时前
【Vue代码分析】前端动态路由传参与可选参数标记:实现“添加/查看”模式的灵活路由配置
前端·javascript·vue.js
刘一说14 小时前
Vue 动态路由参数丢失问题详解:为什么 `:id` 拿不到值?
前端·javascript·vue.js
方也_arkling14 小时前
elementPlus按需导入配置
前端·javascript·vue.js
David凉宸15 小时前
vue2与vue3的差异在哪里?
前端·javascript·vue.js
css趣多多15 小时前
this.$watch
前端·javascript·vue.js