vue图片不存在时加载默认图片

在文件中的img那里添加:οnerrοr="errorImg01"，然后设置errorImg01的路径如果直接写成

errorImg01: ('../../assets/images/item_image.png')，会找不到这个图片

 

由于项目启动后， 图片的路径并不是我们写的路径了。所以我们用

errorImg01: 'this.src="' + require('../../assets/images/item_image.png') + '"'这个来请求图片。

 

如下图：

<template> 
 <div class="goods_img">
  <img :src="item.PicUrl" alt="" :onerror="errorImg01">
 </div>
</template>


<script>

export default {
  name: "ListItems",
  data () {
    return {
      errorImg01: 'this.src="' + require('../../assets/images/item_image.png') + '"'
    }
  }
}
</script>

当你写完后发现并不生效，这时候需要重新运行npm run dev