总结
大厂面试问深度，小厂面试问广度，如果有同学想进大厂深造一定要有一个方向精通的惊艳到面试官，还要平时遇到问题后思考一下问题的本质，找方法解决是一个方面，看到问题本质是另一个方面。还有大家一定要有目标，我在很久之前就想着以后一定要去大厂，然后默默努力，每天看一些大佬们的文章，总是觉得只有再学深入一点才有机会，所以才有恒心一直学下去。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
使用一个<input>元素来上传图片，并使用JavaScript的FileReader API将图片转换为Base64编码。
<template> <div class="avatar-upload"> <label for="avatar-upload-input"> <img :src="form.formObj.user_pic ? form.formObj.user_pic : '../../../public/default.jpg'" id="avatar-preview" alt="Avatar preview"> <p style="margin-bottom: 15px;">头像上传</p> </label> <input type="file" @change="updataAvatar" id="avatar-upload-input" style="display: none;"></div></template><script setup>import { updataAvatarApi, userinfoApi,updataUserInfo } from '../../utils/api'import { Message } from 'view-ui-plus'import { onMounted, reactive, ref } from 'vue'let form = reactive({ formObj: { username: '', nickname: '', email: '', user_pic: '', id: '' }})onMounted(() => { getUserInfo()})// 头像上传const updataAvatar = (event) => { // 获取文件 let file = event.target.files[0] // 图片base64 const reader = new FileReader(); if(file) { reader.onload = (e) => { // e.target.result 就是转化成base64的图片地址 传给后端 console.log(e.target.result); updataAvatarApi({ avatar: e.target.result }).then(res => { if(res.code === 0) { Message.success(res.message) // 重新获取用户信息 getUserInfo() } else { Message.success(res.message) } }) }; } // 读取文件 reader.readAsDataURL(file);}// 用户信息const getUserInfo = () => { userinfoApi().then(res => { if(res.code === 0) { form.formObj = res.data } else { Message.error(res.message) } }).catch(err => console.log(err))}### 最后前端到底应该怎么学才好？如果你打算靠自己摸索自学，那么你首先要了解学习前端的基本大纲，这是你将要学习的主要内容，理解以及掌握好这些内容，便可以找到一份初级的前端开发工作。你还需要有一套完整的前端学习教程，作为初学者最好的方式就是看视频教程学习，初学者容易理解接受。不要选择买书学习，这样的方式没有几个人能学会，基本都是看不下去书，也看不懂书。如果喜欢看书的学弟，可以买一些经典的书籍作为辅助即可，主要还是以看教程为主。每天抽出固定几个小时学习，做好长期学习的准备。学习编程并不是每天光看视频，你学习编程最重要的目的是为了编写软件产品，提供给大众使用，所以用手写出代码实现功能才是我们要做的事情。**[开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】](https://bbs.csdn.net/forums/4304bb5a486d4c3ab8389e65ecb71ac0)** 
