问题描述:

        

笔者在用vue2.0+进行开发时,遇到 <div style="background-image:url('../assets/images/图片.jpg');" >  

 图片显示 不出来

反复确认引入的背景图片路径也没错,然后图片就是显示不出来,也不知道怎么回事

后经过自己。。。。,问题得到了解决.

解决方案:

1. 在script代码块中采用 require 方式引入图片地址 ,代码块如下

const url = require("../assets/images/图片.jpg");

2. 在data里面设置一个返回值 ,代码块如下

 data() {
    return {
      bgImg: {
        backgroundImage: "url(" + url + ")"
      }
    };
  },

3. 渲染到页面标签上面,使图片显示出来,代码块如下

  <div :style="bgImg" ></div>

笔者亲身经历,此方法可解决基于vue2.0+开发 背景图片显示不出来的问题

Logo

前往低代码交流专区

更多推荐