Javascript 如何在react应用程序中使用本地文件而不导入它们

我正在构建一个博客应用程序，我刚刚意识到我不能在react中使用本地文件路径，而且因为我的restapi的响应对于每个图像都是唯一的路径，所以我不能在react中使用它

有没有一种方法可以避免导入每个图像

这就是我目前正在做的：

const imgSrc = this.state.post.img_path

const styles = {
    background: 'url('+imgSrc+')'
}

然后我将样式应用于元素

我这样做是因为我很快就会更新它，并使它成为我将上传3个不同屏幕大小的不同图像。

解决方案：

我没有将图像存储在公用文件夹之外，而是将上载位置更改为将图像存储在public/images文件夹中。谢天谢地，我只有几张照片，所以没那么糟糕

然后我将url设置为：

"https://localhost:3007/images/" + image name gotten from REST api response

现在它可以工作了。

解决方案：

我没有将图像存储在公用文件夹之外，而是将上载位置更改为将图像存储在public/images文件夹中。谢天谢地，我只有几张照片，所以没那么糟糕

然后我将url设置为：

"https://localhost:3007/images/" + image name gotten from REST api response

---

现在它工作了。

您的图像路径是相对的吗？您是否将它们存储在您的

公用文件夹中

文件夹中？实际上，我不将它们存储在我的公用文件夹中，而是将它们存储在react文件夹之外。路径不是相对的，我在php中使用realpath来获取文件的实际路径，因为当我在主机上上传网站时，我希望路径是可用的。你的图像路径是相对的吗？您是否将它们存储在您的

公用文件夹中

文件夹中？实际上，我不将它们存储在我的公用文件夹中，而是将它们存储在react文件夹之外。路径不是相对的，我在php中使用realpath来获取文件的实际路径，因为当我在主机上上载网站时，我希望路径可用。你也可以将其设置为“/images/namehere”。因为公用文件夹是根目录。您也可以将其设置为“/images/namehere”。因为公用文件夹是根目录。