Я работаю над проектом Front-End React Хочу добавить значок загрузки для времени загрузки данных. Это хорошо сработало в начальное время, но не сработало, если данные изменились, вот использование для обработки этого:
useEffect(() => {
setLoading(true);
if (!frameResults.length) {
return;
}
if (typeof graphSetting?.movementDomain[1] === 'string') {
if (graphSetting.movementDomain[1] === 'dataMax+5') {
yAxisDomainRef.current = [0, getDataMax(frameResults) + 5];
}
} else if (typeof graphSetting?.movementDomain[1] === 'number') {
yAxisDomainRef.current = graphSetting.movementDomain;
}
}, [frameResults]);
useEffect(() => {
setLoading(true);
if (frameResults.length < 1) {
return;
}
Boolean(selectedIdx)
const options = new Array({ value: 0, label: t("Overview") })
.concat(frameSectionStartTime.map(
(time, idx) => ({
value: idx + 1,
label: `${t("Section")} ${idx + 1}: ${time.split(" ")[1]}`
})
));
setSectionOption(options);
setSelected(1);
setLoading(false);
}, [frameResults]);
useEffect(() => {
setLoading(true);
if (frameResults.length < 1) {
return;
} else if (selectedIdx == 0) {
const sectionStart = new Date(frameSectionStartTime[0]);
const lastframe = frameResults[frameResults.length - 1].length - 1;
const lastStamp =
frameResults[frameResults.length - 1][lastframe].timestamp;
const sectionEnd = new Date(`${date} ${lastStamp}`);
setMinimapDomain({
x: [sectionStart, sectionEnd],
y: yAxisDomainRef.current
});
setZoomDomain({
x: [sectionStart, sectionEnd],
y: yAxisDomainRef.current
});
setLoading(true);
} else {
const domainStart = new Date(frameSectionStartTime[selectedIdx - 1]);
const lastframe = frameResults[selectedIdx - 1].length - 1;
const lastStamp = frameResults[selectedIdx - 1][lastframe].timestamp;
const sectionEnd = new Date(`${date} ${lastStamp}`);
const sectionLength = sectionEnd - domainStart;
const domainLength = 15000;
const domainEnd = new Date();
domainEnd.setTime(domainStart.getTime() + domainLength);
setMinimapDomain({
x: [domainStart, sectionLength >= 15000 ? sectionEnd : domainEnd],
y: yAxisDomainRef.current
});
setZoomDomain({
x: [domainStart, domainEnd],
y: yAxisDomainRef.current
});
setLoading(false);
}
}, [selectedIdx, frameResults]);
< /code>
Часть компонентов подобна: < /p>
...
< /code>
Я думаю, что это может из -за того, что время рендеринга слишком быстрое, поэтому состояние загрузки не может снова вернуться к True. Я добавил тайм -аут, он может отображать каждый раз, когда меняются данные о создании фреймересута, но слегка задерживается. Он должен немедленно отображаться после изменения данных FramerESult, но теперь он слегка задержка, а затем отображает значок загрузки.
Подробнее здесь: https://stackoverflow.com/questions/797 ... ta-changed