Vue页面已经渲染完图片再获取图片的宽高

<el-image :src="item.filePath" ref="imgSize" @onload="imgload"></el-image>

<span >{{item.imageWidth }}*{{item.imageHeight }}</span> //展示图片的宽高

//js 
// 获取图片宽高,再把宽高值插入原来的数组  this.imgload() 这个方法在页面图片渲染完后调用
imgload(){
  console.log('this.$refs',this.$refs)
  if(this.$refs.imgSize){
     let _o = this.$refs.imgSize
     // console.log('_o',_o)
     let list = this.list.shift(0,1) //去掉原来数组第0个
     for (var i = 0; i < _o.length; i++){
       for(var j = 0; j < this.list.length; j++){
         if(i==j){
            this.list[j].imageHeight =_o[i].imageHeight // 在原来的数组添加字段宽
            this.list[j].imageWidth =_o[i].imageWidth  // 在原来的数组添加字段宽
         }
        }
      }
      this.list.unshift({upload:'upload'}) //在数组最前面添加这个对象
   }
},