在 data.js 中使用 space 处理文件和文件夹

Question

如果我尝试用空格加载 images/folders，我会收到此错误。

message: "ENOENT: no such file or directory, stat 'C:\Users\John\ReactProjects\my-site\frontend\build\index.html'"

虽然我删除空格会起作用，但我对这个解决方案不满意。

我的项目层次结构

编辑 1：

products: [
  {
    name: "Gotham",
    category: "NY",
    image: "/images/Homepage and Store/Gotham.jpg",
    countInStock: 5,
  },
...
]

{products.map((product, index) => (
<img
  className="absolute object-contain w-full h-full"
  src={product.image}
  alt={product.name}
/>
)}

server.js

const app = express();
app.use(express.static(path.join(__dirname, "..", "build")));
app.use(express.static("public"));

Answer 1

代码中的图片url中不需要放%20。您可以随意放置空格，浏览器在请求资源时会将它们替换为 %20.

URL 代码中：

"images/Homepage and Store/Gotham.jpg"

浏览器请求：

images/Homepage%20and%20Store/Gotham.jpg

在 data.js 中使用 space 处理文件和文件夹

Dealing with files and folders with space in data.js

javascript

reactjs

space