将JSX中的空白替换为CSS

我想删除对象字段中的空白，以便使用JSX在CSS中将其显示为背景图像

renderImage(singleMedia, type) {
  let mediaType = singleMedia.mediaType;
  if(type == "image")){
    var mediaPreview = singleMedia.mediaPreview.replace(/\s+/g, '%20');
    console.log("The original image was", singleMedia.mediaPreview, "The NEW ONE IS", mediaPreview);
    var divStyle = {
        backgroundImage: 'url(' + mediaPreview + ')'
    }
  }

 return(
        <div className="image-logo" style={divStyle}> </div>
    );
 }

---

我想知道是否有一种方法可以去除空白并将其转换为divStyle中的%20

问题不在于空白，而在于文件名中的结束括号。将空白替换为

%20

而将

）

替换为

%29

：

var mediaPreview = singleMedia.mediaPreview.replace(/\)/g, '%29');

CSS中的

url

标记

或者，您可以引用整个URL：

var divStyle = {
  backgroundImage: 'url("' + mediaPreview + '")'
}

---

但是你需要转义引号。

哦，好的，我明白了！我能够做另一个解决方案，它起了作用。想知道为什么更换不起作用。我复制粘贴了第一个解决方案，得到了这个：禁止吸烟标志（1%29.png）

var divStyle = {
  backgroundImage: 'url("' + mediaPreview + '")'
}