有人知道“d3”中的这个错误吗？

Question

function Canvas() {
  
  // d3

  useEffect(() => {
    if (!selection) {
      setSelection(select(ref.current));
    } else {
      let x =
        defaultData.data &&
        scaleBand()
          .domain(defaultData.data!.map((d) => d.name))
          .range([0, canvas.chartWidth])
          .paddingInner(0.1);

      let y =
        defaultData.data &&
        scaleLinear()
          .domain([0, max(defaultData.data!, (d) => (axis ? d.bikeC : d.divC))!])
          .range([canvas.chartHeight, 0]);

      let color =
        defaultData.data &&
        scaleLinear()
          .domain([0, max(defaultData.data!, (d) => (axis ? d.bikeC : d.divC))!])
          .range([0.2, 0.8]);

      const xAxisBot = d3.axisBottom(x!);
      const yAxisRight = d3.axisRight(y!);

      selection
        .selectAll('rect')
        .data(defaultData.data!)
        .enter()
        .append('rect')
        // .attr("fill", (d) => d3.interpolateGreens(color(d.divC)))
        .attr('fill', (d) =>
          axis ? d3.interpolateGreens(color!(d.bikeC!)) : d3.interpolateGreens(color!(d.divC!))
        )

        .attr('width', x!.bandwidth)
        .attr('x', (d) => x!(d.name)!)

        .attr('height', 0)
        .attr('y', canvas.chartHeight)
        .transition()
        .duration(1000)
        .delay((_, i) => i * 100)
        .ease(easeCircleOut)
        .attr('height', (d) => canvas.chartHeight - y!(axis ? d.bikeC! : d.divC!) - 10)
        .attr('y', (d) => y!(axis ? d.bikeC! : d.divC!));

我不想再输入感叹号，也不想关闭空检查。 所以没有别的办法了吗？ 这是上次发生的事情，这让我很生气。除了对每个函数进行无效检查之外，真的没有别的办法了吗？

Answer 1

替换：

y!(axis ? d.bikeC! : d.divC!)

与

typeof y === 'function' && y(axis ? d.bikeC! : d.divC!)

为了安全