为什么传入的Number类型值在Firestore中会被存储为字符串？

问题根因 #

你代码里调用的toFixed(2)方法返回值本身就是字符串类型，哪怕你传入的参数是合法数字，经过这个方法处理后都会变成字符串，这就是Firestore将precio字段存储为字符串的直接原因。

修复方案 #

你可以选择以下任意一种方式修复，都能保证存入Firestore的是保留两位小数的数字类型：

• 方案1：将toFixed返回的字符串显式转回数字
  把precio: parseFloat(precio).toFixed(2)替换为：

  precio: Number(parseFloat(precio).toFixed(2))
  

• 方案2：用数学计算实现保留两位小数，避免字符串转换

  precio: Math.round(parseFloat(precio) * 100) / 100
  

额外优化建议 #

• 给precio的状态加默认初始值，避免空值时parseFloat返回NaN：

  const [precio, setPrecio] = useState(0)
  

• 你当前的input标签属性拼写有误，requiredplaceholder需要拆成两个独立属性：

  required
  placeholder="Precio"
  

内容的提问来源于stack exchange，提问作者React Enjoyer