React Awesome Query Builder 数值字段验证信息问题解析

在React Awesome Query Builder项目中，开发者发现了一个关于数值字段验证信息显示的问题。该问题主要影响配置了最小值(min)或最大值(max)的数值类型字段，当用户输入超出范围的值时，系统显示的验证信息存在模板变量未解析的情况。

问题现象

当开发者为数值类型字段配置验证规则时，如果仅设置最小值(min)而未设置最大值(max)，输入小于最小值的数字会显示未解析的模板字符串"{{fieldSettings.max}}"。同理，如果仅设置最大值而未设置最小值，则会显示未解析的"{{fieldSettings.min}}"。

问题根源

经过分析，这个问题源于验证信息生成逻辑中的条件判断不够完善。系统在生成验证信息时，没有充分考虑min或max单独存在的情况，导致模板变量未被正确替换。

解决方案

该问题已在最新版本中得到修复。修复后的逻辑会：

1. 检查min和max是否同时存在
2. 如果只存在min，则生成"值应大于等于{min}"的提示
3. 如果只存在max，则生成"值应小于等于{max}"的提示
4. 如果两者都存在，则生成"值应在{min}到{max}之间"的提示

最佳实践建议

对于使用React Awesome Query Builder的开发者，建议：

1. 尽量同时配置min和max以获得最友好的验证提示
2. 如需自定义操作符标签，可通过widgets.number.opProps进行配置
3. 考虑使用更符合业务场景的标签替代默认的数学符号（如用"年长于"替代">"）

技术实现细节

在MUI配置中，数值字段的验证规则通过fieldSettings属性设置。开发者可以灵活地：

• 定义字段类型为'number'
• 配置支持的运算符（如equal、less、greater等）
• 自定义运算符的显示标签
• 设置最小值和最大值约束

这个修复使得表单验证体验更加完善，特别是在需要精确控制数值范围的业务场景中，如年龄限制、金额验证等。开发者现在可以更自信地使用这些验证功能，而不用担心会向最终用户显示未解析的模板字符串。