01先把数据含义说清楚
数量为零，表示用户给出了一个明确的数值；没有填写，表示暂时没有提供这项信息。两者在展示、筛选和后续统计中可能有不同的含义。
设计可选字段时，可以用 null 表示未提供数据，用数值表示已填写，并让后端与数据库沿用相同约定。这样不需要借用零或其他特殊数字表达空白。
02在转换之前处理空字符串
原生输入框读取到的是字符串。直接调用 Number 转换时，空字符串会得到零，因此应先检查是否为空，再处理数字转换和非法内容。
下面的函数保留空值，同时让非法数字进入错误处理流程。提交表单时，可以在调用处捕获错误并展示对应提示。
JAVASCRIPT
function readOptionalNumber(raw) {
if (raw.trim() === '') return null;
const value = Number(raw);
if (!Number.isFinite(value)) {
throw new Error('请输入有效数字');
}
return value;
}
readOptionalNumber(''); // null
readOptionalNumber('0'); // 0
readOptionalNumber('12'); // 1203让校验与界面保持一致
如果某项是选填，界面就不应展示必填标记，后端也不应要求它必须存在。已经填写的数值，仍要检查业务范围。
使用 Vue 或组件库时，还要核对清空输入后的实际值。不同输入组件可能返回 null、空字符串或其他值，不能只依赖变量的类型声明。建议分别验证留空、填写零、正常数值和非法输入四条路径。
进一步阅读
下列文档用于延伸阅读，文中示例是围绕具体问题编写的简化示例。