rechart 错误 data.slice 不是函数 React.js

问题描述

这是我的api调用

    const getPeso = async () => {
    const jwt = sessionStorage.getItem('Token')
    const user = jwtDecode(jwt)



    const token = sessionStorage.getItem('Token')
    console.log(token)
    const response = await fetch("http://localhost:8080/animals/animal/client?clientId=" + user.id,{
        method: "get",headers: {
            "Authorization": `${token}`,},})
    const dados = await response.json();
    setData(dados)


};

这是我的记录

<LineChart
            width={650}
            height={300}
            data={setData()}
            margin={{
                top: 20,right: 50,left: 50,bottom: 70
            }}
        >
            <Cartesiangrid vertical={false} />
            <XAxis dataKey="data" axisLine={false} tickLine={false} tickMargin={10} color={'#494949'} fontWeight={'500'} />
            <YAxis dataKey='peso' domain={['dataMin','dataMax']} tickCount={4} axisLine={false} tickLine={false} tickMargin={10} color={'#494949'} fontWeight={'500'} />
            <Tooltip />

            <Line
                type="monotone"
                dataKey="peso"
                stroke="#000000"
                activeDot={{ r: 8 }}
            />
        </LineChart>

我正在获取 data.slice 不是功能错误，有人可以帮忙吗？我认为我的图表数据不支持函数，所以我想知道如何将我的 api 传递给一个变量数组并在图表上使用它

解决方法

我认为你在图表中传递函数而不是数据

试试这样的：-

<LineChart
  width={650}
  height={300}
  data={data}
  margin={{
    top: 20,right: 50,left: 50,bottom: 70
   }}
>
  <CartesianGrid vertical={false} />
  <XAxis dataKey="data" axisLine={false} tickLine={false} tickMargin={10} color={'#494949'} fontWeight={'500'} />
  <YAxis dataKey='peso' domain={['dataMin','dataMax']} tickCount={4} axisLine={false} tickLine={false} tickMargin={10} color={'#494949'} fontWeight={'500'} />
  <Tooltip />

  <Line
    type="monotone"
    dataKey="peso"
    stroke="#000000"
    activeDot={{ r: 8 }}
  />
</LineChart>