Question

我正在将图像源数组从服务器（NodeJS Express）发送到客户端（ReactJS），然后我映射该数组并将每个属性添加到图像作为源

    {this.state.imageURLs.map((src, k)=>{
         return (
             <img src={src} key={k} alt="Hello" className="img"/>
         )
     })}

这是控制台中ImageURL的日志：

数组（1）   0：“ / images / 5c8a6e9567d7ad0a4ccf4e3c / bobi-1560108455536ae580d98-4916-4905-b3a0-5429e47f46ec144500.jpg”

长度：1

proto ：数组（0）

，并显示alt（您好）。为什么会这样呢？谢谢！

编辑，这是我如何将图像保存到服务器（带有multer）以及如何将它们推入服务器上的阵列

const imgStorageBaseURL = '/images'
const imgStoragePath = path.join(__dirname, '..', 'images');

const storage = multer.diskStorage({
  destination: (req, file, callback) => {
    const userPath = path.join(imgStoragePath, req.userId);
    fs.mkdir(
      userPath,
      () => callback(null, userPath)
    )
  },


  filename: (req, file, callback) => {
    const filenameParts = file.originalname.split('.');
    const ext = filenameParts.pop();
    const basename = filenameParts.join('.');
    const additionalPath = Date.now() + '' + uuid() + '' + 
    Math.floor(Math.random() * (2000 - 500)) + 500;
    callback(null, basename + '-' + additionalPath + '.' + ext);
  },
})

并保存到数组

var imgarray = []
req.files.forEach((file) => {
  imgarray.push(imgStorageBaseURL + '/' + req.userId + '/' + file.filename)
})

ReactJS：无法正确识别图像src

0 个答案: