本文环境:windows7、vue2.9.6,该方法适用于所有品牌的电脑。

vue.js添加图片的方法:

方法一:

图片通过后端返回引入网络图片路径即可。

            <div class="banner-item"
              :style="{'background': `url(${$base.urlImage}${item.shufflingUrl})`,'background-size':'cover'}"
                 ></div>

方法二:

通过require引入图片

  <script>
      export default {
          data() {
              return {
                  imgUrl: {
                      src: require('../assets/images/index/banner.png'),
                  }
              }
          }
      }
  </script>
  <script>
      require oBanner from '../assets/images/index/banner.png'
      export default {
          data() {
              return {
                  imgUrl: {
                      src: oBanner,
                  }
              }
          }
      }
  </script>

以上就是vue.js怎么添加图片的详细内容,更多请关注其它相关文章!