VUE当请求的图片属性不存在或者属性值为空时分别使用本地默认图片代替

请求不到图片时有两种情况

1. 后台传过来的数据里面有图片对应的属性但是没有图片地址（值）

2. 后台传过来的数据根本就没有这个属性

这个时候前台拿到的数据为null或者是[]，我们可以使用三元表达式或者vue的:onerror() API来进行判断

 <img :src="item.avatar==null? defaultImg : item.avatar" alt="" >

<img :src="item.avatar" alt="" :onerror="defaultImg" >

item.avatar是我们从后台数据拿到的图片的属性名如果他为null，vue就会把item.avatar替换为我们在在data中定义的默认图片属性defaultImg(属性值为图片地址，如果是本地图片就使用require来获取)，否则vue就渲染后台数据里面的item.avatar。

同样的如果是有属性没有值的情况下，我们只需要将判断的条件由NULL改为[]或者''

最后还有一种比较极端的情况，那就是后台传过来的数据同时包含上面两种情况，有的元素没有属性，有的元素有属性没有值。这个时候除了上面用到的三元表达式之外，还要用到vue自己的API(@error)

<img :src="item.avatar==null? defaultImg : item.avatar" @error="defaultImgs(item)"  >

//methods方法
defaultImgs(item){
       {
          item.avatar=this.defaultImg
       }
   },

使用三元表达式来判断属性是否存在，@error判断属性值是否为空（在@error中调用methods中的defaultImgs方法）