Reactjs 在React中显示状态img Url的语法是什么？

我想我有一个简单的问题，我还没有找到一个适合我的答案

其主要思想是：一旦用户将图像上传到aws s3，它就会显示出来（从DB读取的数据仍在进行中，但其工作原理如下+/-）

为什么下面的img没有显示在React中，如果我手动将其设置为它工作：

  handleFiles = async (e) => {   
    const uploadedImage = await uploadFile(e.target.files[0]);
    this.setState({imgLink:uploadedImage})
  };

  state = {
    imgLink: "../../../images/person-01.jpg",
  };
  render() {
    .....
              <div className="bg-transfer">
                <img src={this.state.imgLink} alt="" />
              </div>
         .....
 <div className="single-file-input">
                <input
                  type="file"
                  id="user_image"
                  name="user_image"
                  onChange={this.handleFiles}
                />

我尝试使用

imgLink:“\”../../../../images/person-01.jpg\”，

，因为我认为我缺少链接，但它也不起作用。因为我将从MongoDB读取路径，所以我不能简单地导入图像，但需要动态更改

---

此处应使用什么语法？

uploadedImaged

可能不是有效的url链接，除非函数

uploadFile

返回为文件生成的url。您应该使用s3中生成的文件的url更新状态。

我不太清楚为什么我仍然不能使用img url的状态，但事实证明，如果您直接从MongoDb获取url并将其放入HTML中，它会显示出来。这正是我一开始想要的

---

这一次不需要中间的开发步骤。

1）我按照上面的方法初始化状态，不要从任何地方调用它。2） 一旦我更新了图像文件，我想用新的URL设置状态，这将显示新的文件。3） 抱歉，没有添加上载功能，这将是用户输入。@RaitisLebedevs，上载文件的返回值是多少？它是aws s3上的图像链接。默认情况下，链接也不工作。例如，如果我能够显示链接，如果我硬编码设置的状态，它将工作得很好。添加到细节中，但这并不重要，因为如果我硬编码设置的状态值，则无法显示该状态的图像。

import S3FileUpload from "react-s3";

const ID = "";
const SECRET = "";
//If bucket not set, getting 400 error.
const BUCKET_NAME = "";
//If Region not set then this isn't working, getting 400 error
const REGION_NAME = "";

const config = {
  bucketName: BUCKET_NAME,
  /*dirName: 'media', /* optional */
  region: REGION_NAME,
  accessKeyId: ID,
  secretAccessKey: SECRET,
  /*s3Url: 'https:/your-custom-s3-url.com/', /* optional */
};


export const uploadFile = async (file) => {  
  try {
    const response = await S3FileUpload.uploadFile(file, config)
    return response.location;    
  } catch (error) {
    console.log(error);
  }

};