如何在rechart中添加y轴的百分比？

import React from 'react';
import { LineChart, Line, XAxis, YAxis, Tooltip, CartesianGrid } from 'recharts';

const data = [
  { name: 'A', value: 50 },
  { name: 'B', value: 75 },
  { name: 'C', value: 60 },
  { name: 'D', value: 80 },
];

const CustomTooltip = ({ active, payload }) => {
  if (active && payload && payload.length) {
    const data = payload[0].payload;
    return (
      <div className="custom-tooltip">
        <p>{`${data.name}: ${data.value}%`}</p>
      </div>
    );
  }
  return null;
};

const Chart = () => {
  return (
    <LineChart width={400} height={300} data={data}>
      <XAxis dataKey="name" />
      <YAxis tickFormatter={(value) => `${value}%`} />
      <Tooltip content={<CustomTooltip />} />
      <CartesianGrid stroke="#f5f5f5" />
      <Line type="monotone" dataKey="value" stroke="#ff7300" yAxisId={0} />
    </LineChart>
  );
};

export default Chart;