Input 输入框
单行文本输入框,支持受控值、占位符、前后描述、原生类型、工程数值输入和禁用状态。
使用提示
- 适合:名称输入、搜索框、邮箱/密码等单行文本。
- 适合:用
type: "engineering"输入4.7k、2.2uF、1e-3这类工程数值。 - 不适合:数值范围选择(应当用 slider)。
- 关联组件:select 用于选项选择,slider 用于数值范围。
- 通常放在 column 中组成表单。
- 使用 $value 和 onchange 实现状态绑定。
- 数值和工程输入只显示原生输入框;范围调节应使用
slider,不再提供自绘递减/递增按钮。 onchange会在用户输入时触发。type: "number"仍然输出字符串;需要数值时在表达式中使用Number($event),或使用type: "engineering"读取解析后的number。- 使用
invalid配合error展示校验错误,错误文本会通过aria-describedby关联到输入框。
label 和 unit
label 会渲染为可点击的原生 label;unit 会贴在输入框尾部,适合电压、电阻、频率等带单位的输入。
namespace: "doc_input_label_unit",
layout: {
"input:voltage": {
label: "电压",
value: "3.3",
unit: "V",
description: "Supply rail"
}
}
}
disabled 禁用态
namespace: "doc_input_disabled_diff",
layout: {
"row:diff": {
"input:enabled": {
value: "Editable",
placeholder: "在此输入"
},
"input:disabled": {
value: "测试值",
disabled: true
}
}
}
}
engineering 工程输入
type: "engineering" 使用文本输入框,不使用浏览器原生 number 类型。组件状态保留原始字符串,并额外暴露解析结果:
namespace: "doc_input_engineering",
layout: {
"input:resistance": {
type: "engineering",
value: "4.7kΩ"
},
"stat:parsed": {
label: "解析值",
$value: "resistance.valid ? resistance.number : 'Invalid'",
$unit: "resistance.unit"
}
}
}支持科学计数法和 SI 前缀:p、n、u、µ、m、k、K、M、meg、G、T。单位只做捕获,不做物理维度换算。