vue 动态显示图片报错 404
<img :src="image">当我们动态加载图片的时候会出现如下图错误1.第一种可能,是你写了相对路径引起的,你需要写绝对路径image:'../../assets/image/top10-1.png'你需要改成具体路径image:'/src/assets/images/top10-1.png'2.第二种解决方式你要使用require()<img :src="require
·
<img :src="image"/>
当我们动态加载图片的时候会出现如下图错误
1.第一种可能,是你写了相对路径引起的,你需要写绝对路径
image:'../assets/image/top10-1.png'
你需要改成具体路径
image:'/src/assets/images/top10-1.png'
2.第二种解决方式你要使用require()
<img :src="require(images)"/>
3.第三种解决方式把图片放在public目录下面,但是这样虽然解决了问题,使用webpack打包的时候不会把这里面的文件打包进去。
4.如果你使用了ts 那么就无法使用require(),你可以使用import 把你的图片路径作为一个模块引进来使用
<template>
<img :src="images"/>
</template>
<script>
import image from '../assets/image/top10-1.png'
export default{
data(){
return {
images:image
}
}
}
</script>
更多推荐
已为社区贡献3条内容
所有评论(0)