Skip to content

自定义/动态标题

静态标题

在大多数场景下,直接设置组件的 标题 属性即可:

  • 用于表单项左侧显示的文字,如「姓名」「证件号码」等
  • 会在设计器的大纲、校验提示、错误日志等位置统一展示,便于定位组件

建议始终为每个组件配置一个清晰、简洁且含义明确的静态标题。

动态标题

当标题需要根据用户输入、证件类型、上下文信息等动态变化时,可使用 标题(函) 属性。

标题(函) 本质上是一个 JavaScript 函数,其返回值为需要展示的标题文本。函数通常可以读取:

  • 表单模型 formModel:当前表单各字段值(用于联动)
  • 上下文 excontext:页面/业务上下文(根据项目注入)

常见用法示例:

js
// 根据证件类型返回不同的标题文案
if (formModel.id_type === '1') {
  return '身份证号码';
}
if (formModel.id_type === '2') {
  return '护照号码';
}
return '证件号码';

示例:根据证件类型动态显示证件号码的标题内容:

动态标题

注意事项

  1. 即便您需要设置动态标题,依旧请设置组件的 标题 属性,以便在设计器的大纲、错误日志等功能中提供友好的显示。
  2. 同时设置 标题(函) 属性和 标题 属性时,运行时会优先使用 标题(函) 返回的内容标题 作为设计期与回退显示使用。