在状态更新时更改我的反应组件中的字符串时遇到问题

Question

我有一个代表我的文件名的字符串，我将把它传递给 react-csv CSVLink 组件。我最初将字符串定义为“my-data.csv”之类的东西，并尝试使用从 axios 请求中收到的适当数据来更新它。似乎我不了解这些反应组件如何工作以及数据何时可用的真实流程。在渲染组件之前，我的文件顶部有以下内容。

let fileName = "my-data.csv";
...
const setFileName = (tabName?) => {
    if (!data || !data?.moreData) { // I thought this would be a way to check if the data has been retrieved yet
      return "equipment-data.csv";
    }
    return tabname != "Average Data"
      ? "Equipment " + tabname + " " + `${data.dates[0].date}` + ".csv" // format it with data name + date
      : tabname + `${data.dates[0].date}` + ".csv"; // Same as above, this just results in a different file name
  };

在实际渲染/返回的组件中，我尝试将其设置为：

<CSVLink fileName={setFileName()} data={testData} />

但是，这并没有抓取所有数据来正确格式化文件。它返回类似“Equipment undefined 01-18-2021.csv”的内容，因此它不会抓取所有内容。

最初，我只是尝试在 setFileName() 函数本身中更新“文件名”字符串。像这样的：

const setFileName = (tabName?) => {
    if (!data || !data?.moreData) { // I thought this would be a way to check if the data has been retrieved yet
      fileName = "equipment-data.csv";
    }
    return tabname != "Average Data"
      ? fileName = "Equipment " + tabname + " " + `${data.dates[0].date}` + ".csv" // format it with data name + date
      : fileName = tabname + `${data.dates[0].date}` + ".csv"; // Same as above, this just results in a different file name
  };

但这导致文件名实际上从未被更改，而是停留在我最初给它的占位符值上。关于为什么这不起作用的任何答案和解释都将成为救命稻草:)

Answer 1

我认为您的 TabName 在 return 语句中是错误的。把tabname改成tabName怎么样？

我猜应该是这样的。

const setFileName = (tabName?) => {
    if (!data || !data?.moreData) { // I thought this would be a way to check if the data has been retrieved yet
      fileName = "equipment-data.csv";
    }
    return tabName != "Average Data"
      ? fileName = "Equipment " + tabName + " " + `${data.dates[0].date}` + ".csv" // format it with data name + date
      : fileName = tabName + `${data.dates[0].date}` + ".csv"; // Same as above, this just results in a different file name
  };