更新由：RNSVGPath InvalidNumber 管理的视图的属性“d”时如何解决错误

Question

我需要使用 react-native-chart-kit 加载我的 SQL 服务器数据，但是当我使用此代码时，我收到此错误：更新由以下人员管理的视图的属性“d”时出错：RNSVGPath null InvalidNumberimport React from "react";import { Text, View, Dimensions } from "react-native";import { LineChart } from "react-native-chart-kit";export default class Home extends React.Component {  constructor(props) {    super(props);    this.state = {      isLoading: true,      data: {        labels: [          "Gen",          "Feb",          "Mar",          "Apr",          "Mag",          "Giu",          "Lug",          "Ago",          "Set",          "Ott",          "Nov",          "Dic",        ],        datasets: [          {            data: [],          },        ],      },    };  }  GetData = () => {    const self = this;    return fetch("http://192.168.1.5:80/graph.php")      .then((response) => response.json())      .then((responseJson) => {        // clone the data from the state        const dataClone = { ...self.state.data };        const values = responseJson.map((value) => value.ChiffreAffaire);        dataClone.datasets[0].data = values;        self.setState({          isLoading: false,          data: dataClone,        });      })      .catch((error) => {        console.error(error);      });  };  render() {    return (      <View>        <LineChart          data={this.state.data}          width={Dimensions.get("window").width} // from react-native          height={220}          yAxisLabel={"$"}          chartConfig={chartConfig}          bezier          style={{            marginVertical: 8,            borderRadius: 16,          }}        />      </View>    );  }}我从我的 php 文件中获得的数据如下：[{"ChiffreAffaire":"4800.00"},{"ChiffreAffaire":"12000.00"}]我不知道问题是什么以及为什么会出现此错误；请如果你有任何想法

Answer 1

我解决了我的问题！！！！对于那些有同样问题的人，我会向你解释错误：问题是我的 LineChart 在完全重新加载之前获取数据，因此它变为空，这是一个无效的数字格式；

所以你要做的是在返回之前添加渲染方法：

 if(this.state.isLoading){

    return(

      <View style={{flex: 1, padding: 20}}>

          <ActivityIndicator/>

        </View>

    )

  }

因此，在加载所有数据之前，我们不会传递给 LineChart

Answer 2

这对我有用：

{

    this.state.loadComplete &&

        (<LineChart

            data={this.state.dt}

            width={Dimensions.get("window").width} // from react-native

            height={this.height}

            yAxisLabel=""

            yAxisSuffix="b"

            yAxisInterval={1} // optional, defaults to 1

            chartConfig={this.config}

            bezier

            style={{

                marginVertical: 8,

                borderRadius: 16

            }}

        />)

}