Part.1 问题
在写项目时遇到的一个算是视觉问题吧,没办法,有强迫症 哈哈哈嗝~
不多说亮图:
这是我们正常调用后端接口后的效果,可是不正常的时候。。。
就很看不过去了,反正我是受不了的!
Part.2 如何解决呢?
直接上代码吧:
HTML
<img :src="src" @click="refreshCode">
JavaScript
src: '/sysUser/auth/captcha'
refreshCode: function(){ this.src = "/sysUser/auth/captcha?t=" + new Date().getTime(); }
CSS
img {
float:left;
width:160px;
height:50px;
background: url("../assets/images/code_loading.gif") 60px 7px no-repeat;
&:before {
content: '';
position: absolute;
width: 160px;
height: 50px;
background: url("../assets/images/code-err-bg.png")
}
}
Part.3 效果图
请求接口时,加载 img background
请求成功:
请求失败: