React：在同一个组件中的函数之间共享一个变量答案

【问题标题】：React: sharing a variable between functions in a same componentReact：在同一个组件中的函数之间共享一个变量
【发布时间】：2020-07-08 22:24:20
【问题描述】：

我有一个函数，我应该传递文件名以便它可以到达下一个组件，但我不知道如何在函数式 React 中实现这一点。到目前为止，我有一个变量文件，它存储从下面的 API 返回的文件名

let file = "";
function submitForm(contentType, data, setResponse) {
    axios({
        url: `http://localhost:5000/uploadfile`,
        method: 'POST',
        data: data,
        headers: {
            'Content-Type': contentType
        }
    }).then((response) => {
        setResponse(response.data)
        file = response.data;
    }).catch((error) => {
        setResponse("error");
    })
}

我必须在下面的函数handleClick中传递它

export default function Step2({fileName}) {

    function handleClick() {
        fileName = setFile(file);
        console.log(fileName);
        console.log(JSON.stringify(file));
        window.location.replace('/step3?fileName='+fileName)
    }

...

我需要了解它是如何工作的。

【问题讨论】：

您只想将 file = response.data 从 submitForm 传递到 handleClick？
是的，将文件名从一个函数向下传递到另一个函数
试试 useState 钩子

标签： reactjs axios react-hooks use-state react-16

【解决方案1】：

我通过在组件函数和 useState 挂钩中使用该函数来使其工作。

【讨论】：