內容管理（八）02-刪除-響應無內容處理- JSONBIG.parse(null) 報錯-程式碼最好使用try{}catch(){}，彈出框確認訊息元件使用

11-內容管理-刪除-響應無內容處理

• 點選刪除按鈕
  • 獲取文章的ID （測試帳號刪除無效）
  • 請求刪除介面
  • 成功後
    • 提示 刪除成功
    • 更新 列表

處理沒有響應內容：api/index.js

// 預設配置  轉換響應資料
axios.defaults.transformResponse = [data => {
  // 對data（後臺的原始資料）進行轉換
  // 但是 有一些介面  沒有任何響應內容
  // JSONBIG.parse(null)  報錯，程式碼最好使用try{}catch(){}
  try {
    return JSONBIG.parse(data)
  } catch (e) {
    return data
  }
}]

正常去做刪除功能：view/article/index.vue

繫結刪除事件：

<el-button
              type="danger"
              @click="delArticle(scope.row.id)"
              icon="el-icon-delete"
              circle
              plain
            ></el-button>

彈框-確認訊息元件的使用：

 // 刪除文章
    delArticle (id) {
      this.$confirm('親，此操作將永久刪除該文章, 是否繼續?', '溫馨提示', {
        confirmButtonText: '確定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        // 點選確認觸發的函式
        // 常見的5種請求方式  ——   get 獲取資料 post 新增資料 put 完整修改資料 delete 刪除資料 patch 區域性修改資料
        await this.$http.delete(`articles/${id}`)
        // 代表成功
        this.$message.success('刪除成功')
        //刪除成功後，更新列表
        this.getArticles()
      }).catch(() => {
        // 點選取消觸發的函式
      })
    },