Я реализовал AreaChart из recharts в моем приложении следующим образом:
import React from 'react';
import {
AreaChart,
Area,
XAxis,
YAxis,
Tooltip,
ResponsiveContainer,
} from 'recharts';
import PropTypes from 'prop-types';
const CustomAreaChart = (props) => {
const {
data,
xDataKey,
yDataKey,
areaDataKey,
options,
} = props;
return (
<ResponsiveContainer>
<AreaChart
data={data}
width={options.width}
height={options.height}
margin={options.margin}
>
<XAxis dataKey={xDataKey} />
<YAxis dataKey={yDataKey} />
<Tooltip content={options.renderTooltipContent} />
<Area
type={options.areaType}
dataKey={areaDataKey}
stroke={options.areaStrokeColor}
fill={options.areaFillColor}
/>
</AreaChart>
</ResponsiveContainer>
);
};
CustomAreaChart.propTypes = {
data: PropTypes.array.isRequired,
areaDataKey: PropTypes.string.isRequired,
xDataKey: PropTypes.string,
yDataKey: PropTypes.string,
options: PropTypes.object,
};
CustomAreaChart.defaultProps = {
xDataKey: null,
yDataKey: null,
options: {
width: 500,
height: 400,
margin: {
top: 0,
right: 0,
left: 0,
bottom: 0,
},
renderTooltipContent: null,
areaType: 'monotone',
areaStrokeColor: null,
areaFillColor: null,
},
};
export default CustomAreaChart;
Теперь он работает нормально, но я получил это предупреждение в консоли (chrome).
Предупреждение:componentWillReceiveProps был переименован и не рекомендуется для использования. Для получения подробной информации см. «Некоторую ссылку».
- Переместите код выборки данных или побочные эффекты в componentDidUpdate.
Если вы обновляете состояние при каждом изменении реквизита, выполните рефакторинг своего кода виспользуйте методы запоминания или переместите его в статический getDerivedStateFromProps. Узнайте больше по адресу: "some link"
Переименуйте componentWillReceiveProps в UNSAFE_componentWillReceiveProps, чтобы отключить это предупреждение в нестрогом режиме. В React 17.x будет работать только имя UNSAFE_. Чтобы переименовать все устаревшие жизненные циклы в их новые имена, вы можете запустить npx react-codemod rename-unsafe-lifecycles в исходной папке вашего проекта.
Пожалуйста, обновите следующие компоненты: Animate, Area, AreaChart, Text
Я использую реаги 16.9.0.
У вас есть предложения по удалению этого предупреждения?