vue-speedometer组件minValue属性校验失败：预期数字得字符串如何解决

问题原因 #

• JavaScript 内置的 toFixed() 方法返回值为字符串类型，而非数字类型。该方法设计初衷是输出符合指定小数位数的格式化文本，避免数字类型浮点精度丢失导致的展示异常，因此即使输出内容看起来是数字结构，实际类型仍然是 String。
• 你代码中 min()、max() 方法最终返回的是 toFixed() 的执行结果，自然就是字符串类型，和 vue-speedometer 组件 minValue、maxValue prop 要求的 Number 类型不匹配，因此触发了类型校验错误。直接返回数字字面量 288.2 时类型符合要求，所以可以正常运行。

修复方案 #

在 toFixed() 执行后额外做一次数字类型转换即可，示例代码如下：

min() {
  return Number(parseFloat(this.averageNum - (2 * this.deviationNum)).toFixed(1));
},
max() {
  return Number(parseFloat(this.averageNum + (2 * this.deviationNum)).toFixed(1));
},

也可以用 parseFloat() 代替 Number() 完成转换，效果一致。

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