Upload 上传的简单使用

上传图片的基本使用（1）

        upload 组件本身就支持请求提交上传操作，说白了你使用它不用自己去发请求,它会自己发。
        请求方法:默认就是 POST
        请求路径: action
        请求头：headers
        上传文件的名字：name => 默认为file ,我们要修改为 我们接口对应的参数，如 image

      <el-upload
        class="upload-demo"
        :show-file-list="false"
        name="image"
        drag
        // action切换成我们接口的完整路径
        action="http://api-toutiao-web.itheima.net/mp/v1_0/user/images"
        // headers 配置用户的信息 如 token
        :headers="uploadHeaders"
        :on-success="uploadSuccess"
        :on-success="handleAvatarSuccess"
      >

 data() {
    const token = JSON.parse(window.sessionStorage.getItem('token'))
    return {
      // 获取用户的 token
      uploadHeaders:{
        Authorization: `Bearer ${token}`
      },
    }

 methods: {
    // 成功的回调
    handleAvatarSuccess() {
      // 关闭对话框
      this.addUpladDialogVisible = false;
      // 更新列表
      this.getMaterialImages();
    },
 },