ncform/CONFIG.md

ncform配置详解

{
  title: '表单名称', // 根节点：表单名称
  description: '表单描述', // 根节点：表单描述
  type: 'object', // 根节点：只能是object
  properties: { // 根节点：表单字段
    firstName: {
      
      /* 数据 */
      type: 'string', // 数据类型 string / number / integer / boolean / object / array 
      value: '', // 数据的值
      default: '', // 数据的默认值，value为空的时候取该值

      /* UI */
      ui: {

        columns: 6, // 占用列数，一共12列。6代表占一半
        label: 'First Name', // 标签内容
        showLabel: true, // 是否显示标签（当为false不显示时，依然占着空间）
        noLabelSpace: false, // 标签是否不占空间，优先级比showLabel高
        legend: '', // 标题内容，当对象，数组布局数据类型时有效
        showLegend: false, // 是否显示标题
        description: 'Fill in the first name', // 字段描述信息
        placeholder: 'first name', // 占位内容【支持dx表达式】
        disabled: false, // 是否禁用【支持dx表达式】
        readonly: false, // 是否只读【支持dx表达式】
        hidden: false, // 是否隐藏【支持dx表达式】
        help: { // 帮助信息
          show: true, // 是否显示，默认不显示
          content: '', // 帮助信息
          icon: '', // 帮助图标
          text: '' // 帮助文字
        },
        itemClass: '', // 给表单项添加的样式名
        preview: { // 预览
          type: '', // 预览类型，可选值：video / audio / image / link
          value: '', // 默认值: 'dx: {{$self}}'【支持dx表达式】
          clearable: false, // 是否可删除
          outward: { // 外观
            width: 0, // 宽度，0代表无限制
            height: 0, // 高度，0代表无限制
            shape: '', // 外观形状，可选值：空值 / rounded / circle / ，默认值为空
          }
        },
        linkFields: [ // 关联字段，当值发生变化时，会触发关联字段的一些动作，比如校验
          {
            fieldPath: '', // 关联项字段路径。当为数组项时，则用[i]，如a.b[i].c
            rules: [], // 校验规则名，如required, number
          }
        ],

        /* 渲染组件 */
        widget: 'textarea', // 渲染的组件名
        widgetConfig: {}, // 组件配置
      },

      /* 验证规则 */
      rules: {
        // for Any Instance Type
        required: {
          value: true, // 传给验证规则的配置值
          errMsg: 'it is required!', // 错误信息
          options: { // 验证规则选项
            delay: 300, // 延迟验证的时间（毫秒）
            delayMsg: '异步验证中..' // 延迟验证时的提示
          }
        },
        number,

        // for Numeric Instances 
        minimum,
        maximum,
        multipleOf,
        exclusiveMaximum,
        exclusiveMinimum,

        // for Strings
        url,
        tel,
        ipv4,
        ipv6,        
        email,
        pattern,
        hostname,
        dateTime,
        maxLength,
        minLength,

        // for Arrays
        contains,
        maxItems,
        minItems,
        uniqueItems,

        // for Objects
        maxProperties,
        minProperties,

        /* 自定义的验证规则 */
        customRule: [{
          script: '', // 【支持dx表达式】
          errMsg: '', // 验证错误信息
          linkItems: [ // 当触发校验时，同时触发这些关联的项进行校验（ 建议使用ui.linkFields来替代这里的功能 ）
            {
              fieldPath: '', // 关联项字段路径。当为数组项时，则用[i]，如a.b[i].c
              customRuleIdx: 0 // 触发该项的自定义验证规则的索引
            }
          ]
        }]
      },
    }
  },
  globalConfig: { // 根节点：全局配置
    style: { // 全局样式配置
      formCls: '', // form class
      invalidFeedbackCls: '', // invalid feedback class 
    },
    constants: { // 全局常量配置，可在dx表达中通过{{$const.}}来访问，如{{$const.userName}}
      userName: 'daniel'
    }
  }
}