React怎么插入背景图片呢？

#1

react怎么插入背景图片呢？

#2

问题描述太简单了，提问的时候最好说清楚场景和实际代码，插入背景图片，我理解是给一个设置背景图片（非css方式）:

<div 
     className="discount-icon" 
    style={{backgroundImage: `url(${item.discountIcon})`}}
></div>
#3

就是设置背景图 这样好像不行呢

#4

这样没道理不行，实际使用的代码，直接拷贝到这里了，你怎么操作的

#5

discount-icon调用了什么方法吗

#6

discount-icon是class类名。
插入背景图片是:

style={{backgroundImage: `url(${item.discountIcon})`}}

item.discountIcon是背景图片地址(本地import或在线图片地址)

#7

是这样写的啊

#9

#10

/1533******(1).png/这样写不行的

#11

那要怎么写呢

#12

Google一下吧，看看哪种是你需要的

#13

好吧 谢谢您

#14

使用模版字符串，你用的单引号那样写${}这个是得不到结果的啊

#15

模板字符串是什么啊

#16

可以直接在css样式文件中编写，再把对应的class名绑定给要添加的元素上面。
其实和普通操作是一样的

#17

.css文件
.app{
background: url(’…/imgs/bg_login.jpg’) no-repeat ;
background-size:100% 105%;
}
.js文件

cssModule 配置页面对应的样式 这是个login界面的背景图详细实现。

#18

谢谢您 :slight_smile:

#19

好的:slight_smile: