Reactjs 选择文件后未显示图像URL

我正在处理以下代码。我希望

console.log

会显示所选图像的url。但它显示为空白。沙盒实现是

import React，{useState}来自“React”；
从“@material ui/core/FormControl”导入FormControl；
从“@物料界面/核心/按钮”导入按钮；
从“@material ui/core/Dialog”导入对话框；
从“@material ui/core/DialogTitle”导入DialogTitle；
导入“/App.css”；
函数App（）{
const[fileUrl，setFileUrl]=useState（“”）；
const[file，setFile]=useState（“”）；
const handleAudioChange=事件=>{
const selectedFile=event.target.files[0]；
setFileUrl（URL.createObjectURL（event.target.files[0]）；
console.log（“文件URL”）
console.log（文件URL）
setFile（selectedFile）；
};
返回(
模因生成器文本
图片文件
);
}
导出默认应用程序

setSmth

函数异步工作。它触发rerender，然后

useState

返回新值

如果您需要立即使用值，只需使用设置为状态的值：

const newFileUrl = URL.createObjectURL(event.target.files[0]);
setFileUrl(newFileUrl);
console.log("fileUrl");
console.log(newFileUrl);

const newFileUrl = URL.createObjectURL(event.target.files[0]);
setFileUrl(newFileUrl);
console.log("fileUrl");
console.log(newFileUrl);