用input type='file' 形式上传图片 返显图片

<div class="perInfoHeader">
          <img src="../../../assets/img/defoult.png" alt="" class="defoult" v-if="imgUrl==''">
          <img :src="imgUrl" alt="" class="defoult" v-if="imgUrl!=''">
          <div class="textesd">
            <div class="djfoi-h1">
              <div class="fhkjrdg">
                <a href="#">{{tupian}}</a>
                <input name="ext_field" @change="uploadImg($event)"
                       ref="file" type="file" class="djkfnj-sc">
              </div>
            </div>
            <p class="djfoi-h2">建议100*100px,支持jpg/jpeg/png/gif/bmp格式,大小不超过2M</p>
          </div>
        </div>
      uploadImg(e) {
        var file = e.target.files[0];
        var reader = new FileReader();
        reader.readAsDataURL(file);
        var that = this
        reader.onload = function (e) {
          that.imgUrl = e.target.result
        }
      },

猜你喜欢

转载自blog.csdn.net/qq_39598092/article/details/90070293