我有以下组件,我认为它非常简单。数据被传递到使用 charts.js 呈现条形图的子组件。在第一次渲染时一切正常。但是,当我运行“排序数据”功能时,数据会更新,但子组件不会重新呈现。在基于类的组件中看到了类似的问题,但找不到适合我的案例的答案。
import React, { useState } from 'react';
const Landing = () => {
const [data, setData] = useState([
{ year: 2017, value: 50 },
{ year: 2016, value: 60 },
{ year: 2013, value: 50 },
{ year: 2014, value: 80 },
{ year: 2019, value: 70 }
]);
const sortData = () => {
const newArray = data.sort(function (a, b) { return a.year - b.year })
setData(newArray);
}
return (
<div>
<BarChart data={data} />
<button onClick={sortData} …Run Code Online (Sandbox Code Playgroud)