react中css里面 class中的 图片的相对地址 完美解决 backgroundImage
发现问题:缓存
之前react的图片,也在style里面,也无所谓。
刚做了一个输入框,change的时候改变图片,每次都刷新图片,关键是没缓存,这哪受得了
之前用的:

网上搜索各种插件,替换什么的,都不好使。
最后的解决方案:
- 将css文件,放到 public下,然后就变成公共资源,也不参与打包,也就不会报错了。
- 将index.html中加入
<link rel="stylesheet" href="./assets/css/searchList.css" /> - class的全局属性就能用了,解决了图片的相对路径的问题。

backgroundImage: "url('./assets/images/searchBottomBg" + bgNum + ".jpg')",
.searchListBg1 {
background-image: url('../images/searchBottomBg1.jpg');
}
react中css里面 class中的 图片的相对地址 完美解决 backgroundImage的更多相关文章
- 关于页面中css某些情况下出现不知原因的隔断解决办法
第一种方法:body{margin:0px;padding:0px position:absolute; top:0px;left:0px;} html{ width:100%; overflow-x ...
- ASP.NET中引用dll“找不到指定模块"的完美解决办法 z
DllImport是System.Runtime.InteropServices命名空间下的一个属性类,其功能是提供从非托管DLL导出的函数的必要调用信息.DllImport属性应用于方法,要求最少要 ...
- PyQt5在QWidget窗体中显示Qwidget的自定义类(补:完美解决)
[概览] 1.显示原生Qwidget 1)不使用布局(绝对定位) 2)使用布局 2.显示Qwidget的自定义类 1)不使用布局(绝对定位) 2)使用布局 [知识点] 1.显示原生Qwid ...
- React Native 中 CSS 的使用
首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...
- 纯css实现div中未知尺寸图片的垂直居中
1.淘宝的方法 在曾经的"淘宝UED招聘"中有这样一道题目: “使用纯CSS实现未知尺寸的图片(但高宽都小于200px)在200px的正方形容器中水平和垂直居中.” 当然出题并不是 ...
- React中css的使用
网页的布局.颜色.形状等UI展示方式主要是由Css进行设置,在ReactJs中也是一样.ReactJs中的Css结构方式与传统的Web网页类似,但依然存在一些差异.ReactJs中Css文件本身的编写 ...
- 史上最全的CSS hack方式一览 jQuery 图片轮播的代码分离 JQuery中的动画 C#中Trim()、TrimStart()、TrimEnd()的用法 marquee 标签的使用详情 js鼠标事件 js添加遮罩层 页面上通过地址栏传值时出现乱码的两种解决方法 ref和out的区别在c#中 总结
史上最全的CSS hack方式一览 2013年09月28日 15:57:08 阅读数:175473 做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我 ...
- vue@cli3 public目录下的静态图片,如何使用在css类文件中(sass可行,纯css不行)
之前写了一篇vue文件怎么使用的文章,有人问我怎么在css文件中使用public下的文件,这是个好问题,因为我之前都没有研究过 需要解决的2个问题 一开始按照vue文件的使用方式(https://ww ...
- tp3.2替换模板中如果需要替换的图片在css样式表中怎么办?
因为标签中的 style 定义的样式可直接覆盖 css样式表中定义的样式,所以可以在要替换的标签中用 style 直接定义样式,具体代码如下: <div class="aboutbg& ...
- CSS从大图中抠取小图完整教程(background-position应用)
CSS从大图中抠取小图完整教程(background-position应用) 转自: http://www.cnblogs.com/iyangyuan/archive/2013/06/01/3111 ...
随机推荐
- 14.6 Socket 应用结构体传输
当在套接字编程中传输结构体时,可以将结构体序列化为字符串(即把结构体的所有成员打包成一个字符串),然后将字符串通过套接字传输到对端,接收方可以将字符串解析为结构体,然后使用其中的成员数据.这种方法通常 ...
- 华硕ROG Zenith Extreme Alpha主板评测:主板界的航空母舰
在AMD推第一代锐龙线程撕裂者的时期,华硕ROG Zenith Extreme主板凭借给力的用料,各种便利的超频设计,出色的SupermeFX音效还有万兆网卡赢得了不少用户的好评.现在AMD推出了第二 ...
- CF940F Machine Learning题解
题目链接:洛谷 或者 CF 不是特别难的题,抽象下题意就是算区间次数出现的次数 mex 和带单点修改.看到范围 \(1e5\) 还带修改,传统的 mex 求法里貌似就莫队类算法好带修,考虑带修莫队. ...
- 20.4 延迟加载DLL--《Windows核心编程》
延迟加载的 DLL 是个隐含链接的 DLL,它实际上要等到你的代码试图引用 DLL 中包含的一个符号时才进行加载. DLL延迟加载技术的原理,就是从导入表中去掉某dll这一项,等到正式调用DLL的时候 ...
- MYSQL 3 DAY
目录 MySQL day03 1.约束 1.1.唯一性约束(unique) 1.2.主键约束 1.3.外键约束 2.存储引擎?(整个内容属于了解内容) 2.1.完整的建表语句 2.2.什么是存储引擎呢 ...
- Python3排序sorted(key=lambda)
Python3排序sorted(key=lambda) 简述: 假如d是一个由元组构成的列表,我们需要用到参数key,也就是关键词,看下面这句命令,lambda是一个隐函数,是固定写法,不要写成别的单 ...
- 解决邮件客户端QQ Mail及Thunderbird无法登入Outlook的问题
最近无论是安卓手机的邮件客户端, 或者是 Ubuntu 下的 Thunderbird 都无法登入 Outlook 账号, 原因是需要开启双因素验证. 这个在 Outlook 界面上是不能直接设置的, ...
- [BUUCTF][WEB][极客大挑战 2019]BabySQL 1
靶机打开url 界面上显示,它做了更严格的过滤.看来后台是加了什么过滤逻辑 老规矩先尝试时候有sql注入的可能,密码框输入 123' 爆出sql错误信息,说明有注入点 构造万能密码注入 123' or ...
- Android加载PDF方案(pdf.js,支持缩放)
都知道,Android本身的webview是不支持pdf加载的(比不上iOS的webview,谁让人家NB呢),因此通过连接Google的一个服务器转换成功后返回给WebView显示.但是,但是,但是 ...
- django执行迁移文件报错struct.error: unpack requires a buffer of 4 bytes
问题: 我使用的版本说明 django:2.2版本 djangorestframework:3.11版本 python3.6版本 解决 查了下资料,没有很详细的说明,我是因为需要使用继承django自 ...