por favor ayúdame en esto. Estoy tratando de guardar la imagen de perfil, pero input.addeventlistener no archiva los cambios. estoy usando vue con rieles

Este es el gancho de montaje cuando estoy en un componente vue donde quiero activar el detector de eventos.

 mounted() { debugger this.previewUrl = this.placeholder; const input = this.$refs.inputSlot.querySelector('input[type="file"]') if (input) { input.addEventListener('change', event => { if(input.files[0]){ const fakeFilePath = event.currentTarget.value if (input.files[0].size > this.sizeLimit) { alert(this.$t('error.file_size', { max_size: this.maxSize })); input.value = ''; } else { this.fileName = input.files[0].name if (this.preview == 'image') { const reader = new FileReader(); reader.onload = event => { this.selectedFile = this.oldImage = this.previewUrl; this.previewUrl = event.target.result; this.choosenFile = fakeFilePath; }; reader.readAsDataURL(input.files[0]); } } } }) } }

Este es el campo de entrada

<input accept="image/jpeg,image/png,.jpeg" type="file" name="user[profile_picture]" id="user_profile_picture">