Axios：没有进入错误的catch方法

Question

我有一个编辑合同名称的功能。我使用特定 ID 向后端 API 调用 axios 请求。对于每种情况，我都会调用一条甜蜜的消息。

axios({
       url: '/api/contract/' + id,
       method: 'put',
       data: {
             name: name
       }
       }) .then((response) => {
          this.$emit('fetchAll');
          swal({
               title: "Success!",
               icon: "success"
          });
       }) .catch(error => {
          this.errors = error.response.data.errors;
          swal({
             title: "Error",
             text: error.response.data.message,
             icon: "error"
       });
});

有回应：

403: You are not authorized to edit this contract.

Laravel 控制器中的错误处理：

if (Bouncer::cannot('contract-destroy'))
    abort('403', "You are not authorized to delete this contract");

即使请求出错，也会弹出成功消息。

Answer 1

对于您的爱人，将密钥 icon 更改为 type。否则我认为默认情况下会显示成功消息。所以代码应该是

axios({
       url: '/api/contract/' + id,
       method: 'put',
       data: {
             name: name
       }
       }) .then((response) => {
          this.$emit('fetchAll');
          swal({
               title: "Success!",
               type: "success"
          });
       }) .catch(error => {
          this.errors = error.response.data.errors;
          swal({
             title: "Error",
             text: error.response.data.message,
             type: "error"
       });
});

Answer 2

我现在发现了问题，回调参数应该定义为Object。我不知道为什么会出现问题，但现在已修复。

axios({
   url: '/api/contract/' + id,
   method: 'put',
   data: {
         name: name
   }
   }) .then(({data}) => { <-------instead of (response)
      this.$emit('fetchAll');
      swal({
           title: "Success!",
           icon: "success"
      });
   }) .catch(error => {
      this.errors = error.response.data.errors;
      swal({
         title: "Error",
         text: error.response.data.message,
         icon: "error"
   });

});