使用Vue实现图片上传及实时预览效果

使用Vue实现图片上传及实时预览效果

• 今天在做字节跳动笔试题的时候遇到一个实现图片上传并且要实时预览效果的要求
• 网上大多数答案是基于原生js的，因为本人最近在学习vue,看了一下讲解之后结合vue的语法尝试几次之后终于实现了。
• 核心代码放在这里主要为了自己以后好找，需要的朋友也可以进行参考。

html部分

<div id="app">
	<input class="filePrew" type="file"  @change="addpht()" ref="img">
	//change监听表单完成文件选择  ref为了在js里找到DOM元素
	<img :src="picSrc" style="width: 200px;height:200px;" >
</div>

js部分

<