Graph组件TextInput输入0或null时触发toFixed函数未定义错误

错误原因 #

你遇到的错误是因为TextInput输入的内容是字符串类型：当你输入"0"时，var1被设置成了字符串"0"，而LineChart的data数组需要数字类型的值来调用toFixed方法，字符串没有这个方法，因此触发报错。移除Calculate函数后问题仍存在，说明错误根源不在计算逻辑，而在图表数据的类型不匹配。

修复步骤 #

1. 转换输入值为数字类型 #

修改TextInput的onChangeText回调，将输入的字符串转换为数字，同时处理空输入的情况：

onChangeText={text => setVar1(text ? Number(text) : 0)}

2. 确保TextInput的value为字符串类型 #

TextInput的value属性要求是字符串，所以把var1转为字符串：

value={var1.toString()}

3. 优化数字转换的健壮性（可选） #

如果用户输入非数字内容（比如字母），Number(text)会返回NaN，可以进一步处理避免异常：

onChangeText={text => {
  const num = Number(text);
  setVar1(isNaN(num) ? 0 : num);
}}

完整修改后的TextInput代码 #

<TextInput
  style={styles.input}
  placeholder="Energieverbrauch in kWh"
  placeholderTextColor="#009688"
  keyboardType="numeric"
  onChangeText={text => {
    const num = Number(text);
    setVar1(isNaN(num) ? 0 : num);
  }}
  value={var1.toString()}
  returnKeyType="done"
/>

额外建议 #

你可以统一把var2、var3、var4的相关输入（如果有的话）也做同样的类型转换，避免后续出现类似问题。

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