- vue动态绑定img src时,出现404,原因在于路径并不会被 webpack 编译,还保持着相对路径的状态。
如以下代码:
![](path)
data () {
return {
path: '../resource/img/song.png'
}
}
应修改代码如下:
data () {
return {
path: require('../resource/img/song.png')
}
}
拓展:
如果使用的是背景图的方式,那么在上述js的基础上,可以这样
<div :style="{backgroundImage: 'url(' + path + ')'}"></div>
或者直接在css中定义
background-image: url('../resource/img/song.png');