日期 表单
组件 ID: date
这是一个标准的 SunForm 表单组件,支持可视化配置与低代码生成。
JSON 配置示例
直接复制以下 JSON 到配置文件中即可使用。
{
"type": "date",
"props": {
"label": "日期",
"value": null,
"labelAlign": "left",
"labelPosition": "top",
"valueStr": null,
"labelWidth": "120upx",
"hide": false,
"size": "default",
"direction": "horizontal",
"zdname": "",
"hasLabel": true,
"required": false,
"readonly": false,
"disabled": false,
"placeholder": "请选择日期",
"showClear": true
}
}
属性配置 (Props)
| 属性名 | 类型 | 默认值 | 说明 |
|---|---|---|---|
label |
string | 日期 | 标签文本/标题 |
labelAlign |
string | left | 标签对齐方式 |
labelPosition |
string | top | 标签位置 (top/left) |
value |
any | null | 表单值 / 绑定值 |
valueStr |
any | null | 暂无描述 |
labelWidth |
string | 120upx | 标签宽度 |
hide |
boolean | false | 是否隐藏该组件 |
size |
string | default | 组件尺寸 (small/default/large) |
direction |
string | horizontal | 排列方向 (row/column) |
zdname |
string | - | 暂无描述 |
hasLabel |
boolean | true | 暂无描述 |
required |
boolean | false | 是否必填 |
readonly |
boolean | false | 是否只读 |
disabled |
boolean | false | 是否禁用 |
placeholder |
string | 请选择日期 | 占位提示文本 |
showClear |
boolean | true | 暂无描述 |
startPlaceholder |
string | 开始日期 | 暂无描述 |
endPlaceholder |
string | 结束日期 | 暂无描述 |
isRange |
boolean | false | 暂无描述 |
type |
string | day | 暂无描述 |
format |
string | YYYY-MM-DD | 暂无描述 |
formatValue |
string | YYYY-MM-DD | 暂无描述 |
disabledDate |
string | - | 暂无描述 |
start |
string | 2000-1-1 | 暂无描述 |
end |
string | 2050-12-31 | 暂无描述 |
defaultNow |
boolean | false | 暂无描述 |
color |
string | - | 组件主色调 |
align |
string | left | 垂直排列方式 |
fontSize |
string | 32 | 暂无描述 |
leftIcon |
string | - | 图标 |
leftText |
string | - | 暂无描述 |
onCreated |
any | null | 组件创建时触发的事件 |
onMounted |
any | null | 组件挂载后触发的事件 |
onChange |
any | null | 事件回调 |