Piechart -Animation spielt nicht beim Einstellen großer Status -Array ⇐ JavaScript

[Anonymous]

Ich habe eine React-Komponente, die einige Daten aus dem Backend erhält und das Ergebnis zu einem PieChart zeigt.

Code: Select all

function SiteInfo() {

const [url, setUrl] = React.useState('Loading...')
const [title, setTitle] = React.useState('Loading...')
const [uptime, setUptime] = React.useState(0)
const [uptimeData, setUptimeData] = React.useState([])
const [online, setOnline] = React.useState(false)
const [latency, setLatency] = React.useState(-1)

const [searchParams, _] = useSearchParams()
const siteid = searchParams.get('siteid')

React.useEffect(() => {
(async () => {
const response = await fetch(`http://localhost:3000/siteinfo/${siteid}`, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'Authorization': `Bearer ${localStorage.getItem('auth_token')}`
}
})
const siteinfo = await response.json()
const sitedata = siteinfo.sitedata
console.log(sitedata.uptimeData)
setUrl(sitedata.site)
setTitle(sitedata.title)
setUptime(sitedata.uptime)
setUptimeData(sitedata.uptimeData)
setOnline(sitedata.uptimeData.at(-1).up)
setLatency(sitedata.uptimeData.at(-1).latency)
})()
}, [siteid])

return (
// ...








// ...
)
}

Es gibt eine Animation, die dem PieChart zugeordnet ist, das normalerweise angezeigt wird, wenn ich die Zeilen -Setuptimedata (Sitedata.Uptimedata) entferne, aber wenn die Zeile vorhanden ist, wird die Animation nicht gespielt. Auch wenn UpTimedata in keiner Weise mit dem Kreisdiagramm zusammenhängt. Ich kann jedoch keinen Weg finden, diesen oder einen alternativen Weg zu bestätigen, um den Zustand festzulegen.>