本地预览图片

image.png

以下函数绑在input标签的change事件上
preview(e) {
let that = this;
let file = e.target.files[0];
that.$emit("imgFile", file);//传给父组件的file对象,上传到服务器

            let reader = new FileReader();
            reader.readAsDataURL(file);
            reader.onloadend = function () {
                that.imgUrls.push(reader.result);//reader.result为img标签src可读取的结果
            };
        },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 我们使用H5可以很容易的实现图片上传前对其进行预览的功能 Html代码如下: 实现预览功能的js代码如下: 最后注...
    雪飞鸿阅读 2,803评论 0 4
  • Correctness AdapterViewChildren Summary: AdapterViews can...
    MarcusMa阅读 8,928评论 0 6
  • 总希望这个世界能多带点善意 我怀念在小村庄的日子,那时的天很蓝,太阳是温暖的不是晒人的,山是绿的,水是清澈的不是浑...
    陈苡安阅读 180评论 0 1
  • 常常忘记在身边备一把伞,又遇上雨天,无奈淋雨小跑。路上总有合撑一把伞的两个人慢慢走着,雨天也成了加深情谊的...
    灵诗葭阅读 202评论 0 0
  • 女孩你成了别人的爱人男孩你的懦弱成全了他人造物主造就了我们却从未告诉我们该如何去爱谁都会后悔谁都会死亡至少不是眼下...
    看晚霞的人阅读 205评论 0 0