Recharts如何自定义Y轴刻度标签，实现布尔值0/1映射为No/Yes？

问题原因 #

你的实现未生效主要是两个基础错误导致：

• Prop传参不匹配：你给CustomYAxisTick传递的属性是type={itemType}，但组件内部接收的参数名是itemType，导致布尔类型的判断逻辑永远不触发
• 未绑定刻度坐标：自定义tick组件返回的<text>元素没有透传x、y坐标属性，导致刻度文本渲染到可视区域外，看似功能未生效

修复代码 #

1. YAxis配置部分 #

可额外增加布尔类型时的Y轴范围限制，避免出现多余中间刻度：

// 提前计算Y轴范围
const yAxisDomain = itemType === "BOOLEAN" ? [0, 1] : [0, domainMax];

// 渲染Y轴，注意传递的prop名和组件接收名一致
<YAxis 
  interval="preserveStartEnd" 
  domain={yAxisDomain} 
  tick={<CustomYAxisTick itemType={itemType} />} 
/>

2. CustomYAxisTick组件实现 #

补充坐标和默认对齐样式，和原生刻度表现一致：

const CustomYAxisTick = ({ x, y, payload, itemType }: any) => {
  if (itemType === "BOOLEAN") {
    if(payload.value === 0) {
      return <text x={x} y={y} textAnchor="end" dominantBaseline="middle">No</text>
    };
    if(payload.value === 1) {
      return <text x={x} y={y} textAnchor="end" dominantBaseline="middle">Yes</text>
    };
    return null;
  } else {
    return (
      <text x={x} y={y} textAnchor="end" dominantBaseline="middle">
        {payload.value}
      </text>
    );
  }
}

内容的提问来源于stack exchange，提问作者Sharon