input动态添加图片文件，如何保证图片加载到页面后获取尺寸

Question

想实现利用canvas实现类似cropper截图功能，在实际中发现图片动态加载到页面，无法获取其尺寸的问题，代码如下：function submitImg(){    var $originImg=$('.originImg');    var $input=$('<input>/').attr({'type':'file'}).css({'display':'none'}).appendTo($('body'));    $input.on('change',function(){        console.log(this.files[0]);        var file=this.files[0];        //判断文件类型是否为图片        if(!/image/.test(file.type)){            alert('请选择图片');            return;        }        var reader=new FileReader();        reader.onload=function(e){                console.log($originImg.width());    //0        }        reader.readAsDataURL(file);    })    $input.click();}在reader.onload函数中将图片文件转换成base64,然后加载到页面中，$originImg.attr('src',e.target.result);页面中可以显示图片，但无法获取到图片的尺寸，若在页面中打印，也可以获取图片的尺寸，该如何处理？附：js中有没类似Vue.nextTick()方法更新DOM节点？