Vue.jsで複数の画像をbase64化し、配列にいれたがアクセスの仕方が

Vue.js にて複数の画像をbase64化させて配列にいれたいのですが、
ログを見ると[]となっており、 imgData.length は[0]、imgData[0]はundefinedとなってしまい データにアクセスができないです。
どうしたらこのデータにアクセスできるでしょうか。

<input type="file" @change="imageToBase64" multiple> <img :src="previewBase64"> imageToBase64(event){ let imgData = [] for (i = 0; i < event.target.files.length; i++) { let fileReader = new FileReader(); fileReader.onload = (function (e) { imgData.push(e.target.result) }); fileReader.readAsDataURL(event.target.files[i]) } console.debug(imgData)