专栏首页前端开发随笔Vue上传头像到服务器加回显照片

Vue上传头像到服务器加回显照片

   <div class="update">
      <input
        type="file"
        @change="uploadFile($event)"
        ref="avatarInput"
        accept="image/*"
      />
    </div>

<script>
 methods: {
    uploadFile(e) {
      var file = e.target.files[0];
      var formData = new FormData();
      //这里是生成链接需传的参数
      formData.append("file", file);
      formData.append("key", "Gn1xVdagWO");
      this.$axios({
          method: "post",
          url:"uploadFile",
          data: formData	
        })
        .then((res)=> {
        //获取链接再赋值就行了
        console.log(res.data.info.url)
        });
    },
</script>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Css实现瀑布流布局

    我们只需要设置最外层的父级(waterfall)和子级的父元素(poster)的css就可以

    wePanda
  • jQuery实现上传文件获取进度条

    wePanda
  • Css实现点击图片旋转动画

    wePanda
  • 分页工具类

    杨校
  • SCN exercise navigation的实现原理

    Jerry Wang
  • springboot添加邮件发送及压缩功能

    转载请注明出处:https://www.cnblogs.com/funnyzpc/p/9190233.html

    上帝
  • SAP UI5 ResponsiveGridLayout

    Jerry Wang
  • why is list delete and edit icon rendered

    Jerry Wang
  • how is my real odata request hijacked by Mock server

    Jerry Wang
  • SAP UI5:how to connect mock data

    Jerry Wang

扫码关注云+社区

领取腾讯云代金券