在我的项目中,我希望在两组数据之间切换:当前周每天的总工作小时数,以及当前年每月的总工作小时数。我可以在按钮处理程序中实现Chart.js标签操作,但无法修改状态的数据属性。我缺少什么?谢谢您的帮助。
**注意:**注解代码在取消注解时会生成以下错误语句:Uncaught TypeError: nextDatasets.map is not a function
LineChart.js
const [userData, setUserData] = useState({
labels: Object.keys(daysData),
datasets: [
{
label: "Hours worked",
data: Object.values(daysData),
backgroundColor: "red",
borderColor: "black",
borderWidth: 2,
},
],
});
const onShowWeeklyHandler = () => {
setUserData({ labels: Object.keys(daysData) });
// setUserData({ datasets: { data: Object.keys(daysData) } });
};
const onShowMonthlyHandler = () => {
setUserData({ labels: Object.keys(monthsData) });
// setUserData({ datasets: { data: Object.keys(monthsData) } });
};
1条答案
按热度按时间agyaoht71#
您可能会遇到问题,因为您正在尝试使用useState挂接浅合并状态。React不支持此操作。有关详细信息,请参阅this answer。
如果这不能解决您的问题,您是否研究过react-chartjs-2?您可能能够通过执行以下操作来实现您想要的结果。
在父组件(包含图表的组件)中:
然后,您的处理程序可以是:
最后道: