<el-form-item label="圖片驗證碼" label-width="25%">
        <el-col :span="15">
            <el-form-item prop="photoIdentityCode">
              <el-input type="text" v-model="loginForm.photoIdentityCode" placeholder="單擊圖片刷新"
                style="width: 100%;"  @keyup.enter.native="login" clearable>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col class="line" :span="1">&nbsp;</el-col>
          <el-col :span="8">
            <el-form-item>
                <img class="captcha-img pointer" :src="loginForm.src" @click="refreshCaptcha" clearable> 
            </el-form-item>
          </el-col>
        </el-form-item>

所有請求采用axios進(jìn)行封裝；

//獲取圖片校驗碼
    refreshCaptcha: function(){
      this.loginForm.timeStamp=new Date().getTime();
      let params={
        "data":{
        "timeStamp":this.loginForm.timeStamp
        }
      }
      this.$api.LoginManage.getPhotoValidCode(params).then((res)=>{
        let img = btoa(
          new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), '')
        );
        this.loginForm.src=  'data:image/png;base64,' +img;
      })
    },

后端返回為圖片流，所以要加 responseType: "arraybuffer" 這句代碼；

// 獲取圖片驗證碼
export const getPhotoValidCode = (params) => {
    return axios({
        url: 'loginInfo/getPhotoValidCode',
        responseType: "arraybuffer",
        method: 'post',
        params
    })
}