vue中img圖片加載中以及加載失敗顯示默認圖片問題

加載中默認圖片：
主要是onload事件監聽，data中定義變量

imgSrc ：require('./default.png')；

<div class="per-pic" v-for="(item, index) in picData" :key="index">
    <img :src="imgSrc" :onload="loadImg(item.url)" />
</div>

/*
  **圖片加載中
* */
 loadImg($img){
     return 'this.οnlοad=null;this.src='+'"'+$img+'";';
 },


加載失敗目前網上很多都是用onerror事件監聽，然后給this.src賦值，壓根不管用啊，試了半天不管用。
用css倒是能輕松解決，具體代碼如下：
img{
   width: 145px;

   height: 145px;

   position: relative;

&:after{
 content: "";
 display: inline-block;
 position: absolute;
 z-index: 2;
 top: 0;
 left: 0;
 width: 100%;
 height: 145px;
 background: url("./default.png") no-repeat;
 background-size: 100% ;
 background-color: #fff;
}

}；

覺得好用的，請點贊，蟹蟹。