起源
第一次学习Vue项目,图片没有存Oss,而是选择固定路径。
解决问题
第一种
<template>
<div id="app">
<img :src="Img" alt="图片资源" class="img">
</div>
</template>
export default {
name: 'app',
data() {
return {
Img:require( '../assets/show/pic.jpg')
};
},
}
</script>
第二种(常规用法)
<style>
.img {
background: url(../assets/show/pic.jpg) no-repeat;
}
</style>
- Vue中使用静态文件,得益于vue-loader的处理会改变打包路径,使用require是最好的处理方式