小编Has*_*dil的帖子

问题只是我试图访问静态图像以在 React 的内联 backgroundImage 属性中使用。

我正在使用 reactjs 和 next.js 然后我在使用 next.js 添加图像时遇到了问题，但通过使用名为 Next.js + Images 的图像加载器修复了这个问题，

现在我可以使用普通的 html img 标签正常添加图像

示例：<img src={ img } />这有效。

但是当我尝试添加如下 css 背景图像时：

const team = (props) => {
const img = require("../../assets/images/security-team.jpg");
const styling = {
    backgroundImage: `url('${img}')`,
    width:"100%",
    height:"100%"
}
console.log(img);
return (
    <dev className="team" style={styling}>

    </dev>
);

}

这是 console.log 结果：

/_next/static/images/security-team-449919af8999ae47eaf307dca4dda8e1.jpg

图像没有出现，然后没有发生错误，我尝试在浏览器中输入 website-url + console.log 结果图像出现了！