formBuilder项目中自定义数据属性的正确使用方式

formBuilder作为一款强大的表单构建工具，允许开发者通过typeUserAttrs配置项为表单元素添加自定义属性。在实际开发中，我们经常需要为表单元素添加data-*属性来实现特定的功能需求。

数据属性的命名规范

在formBuilder中，自定义数据属性支持两种命名方式：

1. 连字符格式：使用data-前缀加连字符分隔的命名方式，如'data-my-attribute'
2. 驼峰格式：使用data前缀加驼峰命名的格式，如'dataMyAttribute'

这两种格式都会被formBuilder正确处理，但在内部存储时，系统会自动将连字符格式转换为驼峰格式。例如：

typeUserAttrs: {
    '*': {
        'dataMyData': {
            label: '驼峰格式示例',
            value: '',
        },
        'data-my-data2': {
            label: '连字符格式示例',
            value: '',
        },
    }
}

实际存储格式

无论开发者采用哪种命名方式，最终在表单数据中都会以驼峰格式存储：

{
    "dataMyData": "示例值1",
    "dataMyData2": "示例值2"
}

特殊属性处理注意事项

对于HTML标准属性如title，需要注意不同表单元素的渲染差异：

1. 文本框等元素：title属性会被正常渲染
2. 复选框和单选按钮：title属性可能不会被渲染

最佳实践建议

1. 保持一致性：在项目中统一使用一种命名风格（推荐驼峰格式）
2. 属性前缀：自定义属性建议始终使用data前缀，符合HTML5规范
3. 兼容性考虑：如果需要在前端直接使用这些属性，注意转换后的驼峰命名
4. 文档注释：为自定义属性添加详细注释说明用途

通过正确理解和使用formBuilder的自定义属性机制，开发者可以更灵活地扩展表单功能，满足各种业务场景需求。