.vue文件插入图片

HTML:
img(:src='imgUrl')

JS:
export default {
  data () {
    return {
      imgUrl: './images/logo.png'
    }
  }
}

直接这么写会被webpack当成字符串处理,引用的并不是真正的图片路径,正确写法:

HTML:
img(:src='imgUrl')
import logo from './images/logo.png'

export default {
  data () {
    return {
      imgUrl: logo
    }
  }
}

data () {
  return {
    imgUrl: 'http://www.baidu.com/imgs/logo.png'
  }
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 版权声明:本文为博主原创文章,未经博主允许不得转载。 webpack介绍和使用 一、webpack介绍 1、由来 ...
    it筱竹阅读 11,263评论 0 21
  • 构建一个小项目——FlyBird,学习webpack和react。(本文成文于2017/2/25) 从webpac...
    布蕾布蕾阅读 16,921评论 31 98
  • 作者:小 boy (沪江前端开发工程师)本文原创,转载请注明作者及出处。原文地址:https://www.smas...
    iKcamp阅读 2,774评论 0 18
  • 最近的自己不知道怎么回事,总是容易哭泣。总是容易觉得自己不被在乎,也许真的是自己喜欢上了,所以才会那么无理取闹。 ...
    旅行在路上1993阅读 199评论 1 0
  • 早就想写这样的一篇文章,讲讲我生活过的土地,山川不同,风俗各异,语出贾平凹《秦腔》,这便是自然,从旱塬上刮过的风一...
    艺术家清樾阅读 589评论 4 4