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

相关推荐
不会敲代码18 小时前
从零到一:用 Vue3 + Kimi 大模型打造「拍照记单词」AI 应用
vue.js·typescript·aigc
隔壁的大叔8 小时前
Markdown 渲染如何穿插自定义组件
前端·javascript·vue.js
RONIN8 小时前
脚手架搭建项目框架(create-vite、vue-cli、create-vue、quasar-cli)
vue.js
愚者Pro8 小时前
Flutter基础学习
前端·javascript·vue.js
RONIN9 小时前
mock模拟后端,生成伪数据接口
vue.js
Hello-Mr.Wang10 小时前
【保姆级教程】MasterGo MCP + Cursor 一键实现 UI 设计稿还原
前端·javascript·vue.js·ai编程
RONIN10 小时前
UI组件库vant3(移动端用的比较多)
vue.js
本末倒置18310 小时前
Vue 3 开发者转型 React 指南:保姆级教程
前端·javascript·vue.js
卜凡.12 小时前
Vue是对HTML、CSS、JS的标准化、组件化和响应式的上层抽象与增强
javascript·vue.js·html
Ww.xh13 小时前
鸿蒙系统中HTML与Vue集成方案
vue.js·html·harmonyos