React.js从其他函数取值导出TXT时参数undefined问题求助

问题根源 #

1. 参数传递错误：调用exportFile时，未将normalizePredictions计算好的坐标值正确传入，导致函数内参数为undefined；
2. 变量赋值错误：exportFile里的let points = (x, y, width, height);是无效写法，这是逗号运算符，最终points只会等于最后一个参数height，无法保留四个坐标值。

修正代码 #

1. 重构exportFile函数 #

改为接收处理后的预测数组，将所有坐标格式化为可写入文件的文本：

const exportFile = (processedPredictions) => {
  // 将每个预测的bbox转换为一行文本，用逗号分隔坐标
  const content = processedPredictions.map(pred => {
    const [x, y, width, height] = pred.bbox;
    return `${x}, ${y}, ${width}, ${height}`;
  }).join('\n');

  const blob = new Blob([content], { type: "text/plain;charset=utf-8" });
  saveAs(blob, "testfile1.txt");
};

2. 正确调用导出函数 #

先通过normalizePredictions得到处理后的坐标数组，再传给exportFile，示例如下（以按钮点击触发导出为例）：

// 假设yourPredictions是原始预测数据，yourImgSize是图片尺寸对象
<button onClick={() => {
  const processedData = normalizePredictions(yourPredictions, yourImgSize);
  exportFile(processedData);
}}>导出坐标</button>

3. 保留原normalizePredictions函数 #

该函数的坐标计算逻辑正确，无需修改，它会返回包含修正后bbox的预测数组。

可选调整 #

• 如果只需要导出单个预测的坐标，调用时可取数组第一个元素：exportFile([processedData[0]])；
• 可根据需求调整文本格式，比如改成x:${x}, y:${y}, width:${width}, height:${height}这种更易读的样式。

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