Vue input[type=file]上传图片并转为base64预览

input[type = file] 文件 转换 base64地址，再渲染到页面上。

 

        {{userPhoto }}
        

export default {
    data() {
        return {
            userPhoto: "",
        };
    },
    methods: {
      fileChange(event) {
            var that = this
            var files = document.getElementById("userAvatar").files[0]
            var reader = new FileReader();
            reader.onloadend = function () {
                that.userPhoto = reader.result;
                console.log(reader.result)
            };
            if (files) {
                reader.readAsDataURL(files);
            }
      },
}