Fetch 基本操作 Get Post Delete Put

//删除请求
async function DeleteModel(model: Customer) {
  let url = `http://localhost:57679/api/Customers/${model.id}`
  await fetch(url, {
    method: 'delete'
  })
    .then((response) => {
      if (!response.ok) {
        console.log(response)
        throw new Error()
      }
    })
    .then(() => {
      tableData.value.splice(
        tableData.value.findIndex((m) => m.id == model.id),
        1
      )
      ElMessage.info('删除成功！')
    })
    .catch((err) => {
      console.log('catch')
      console.log(err)
      ElMessage.error(`删除失败${err.message}`)
    })
}

//批量删除
async function BatchDelete() {
  let rows = multipleTableRef.value?.getSelectionRows() as Array<Customer>
  if (rows.length == 0) {
    ElMessage('请选择需要删除的记录')
    return
  }
  isSaved = false
  const ids = rows.map((m) => m.id).join(',')
  const url = `http://localhost:57679/api/Customers/BatchDelete/${ids}`
  await fetch(url, {
    method: 'Delete',
    headers: {
      'Content-Type': 'application/json'
    }
  })
    .then((res) => {
      if (!res.ok) {
        return res.text()
      }
      isSaved = true
      return res.json()
    })
    .then((data) => {
      if (isSaved) {
        rows.forEach((row) => {
          tableData.value.splice(
            tableData.value.findIndex((m) => m.id == row.id),
            1
          )
        })
        ElMessage.error(`已成功删除 ${data} 条记录`)
      } else {
        ElMessage.error(data)
      }
    })
    .catch((err) => {
      ElMessage.error(err.message)
    })
  return false
}

async function Add() {
  let isOk = false
  const url = `http://localhost:57679/api/Customers`
  await fetch(url, {
    method: 'Post',
    body: JSON.stringify(ruleForm),
    headers: {
      'Content-Type': 'application/json'
    }
  })
    .then((res) => {
      isOk = res.ok
      if (!res.ok) {
        return res.text()
      }
      return res.json()
    })
    .then((data) => {
      if (isOk) {
        resultCustomer = data
      } else {
        ElMessage.error(data)
      }
    })
    .catch((err) => {
      ElMessage.error(err.message)
    })
  return isOk
}
async function Edit() {
  let isOk = false
  const url = `http://localhost:57679/api/Customers`
  await fetch(url, {
    method: 'Put',
    body: JSON.stringify(ruleForm),
    headers: {
      'Content-Type': 'application/json'
    }
  })
    .then(async (res) => {
      isOk = res.ok
      if (!res.ok) {
        return res.text()
      }
      return res.json()
    })
    .then((data) => {
      if (isOk) {
        resultCustomer = data
      } else {
        ElMessage.error(data)
      }
    })
    .catch((err) => {
      ElMessage.error(err.message)
    })
  return isOk
}

async function LoadData() {
  tableData.value.splice(0, tableData.value.length)
   let url = `http://localhost:57679/api/Customers/${paging.pageSize}/${paging.currentPage}`
  try {
     await fetch(url, {
       method: 'post',
       body: JSON.stringify(formInline),
       headers: {
         'Content-Type': ' application/json-patch+json'
       }
     })

     .then((response) => {
       if (response.ok) {
         return response.json()
       }
       if (response.status == 404) {
         paging.total=0
         throw new Error('没有找到任何数据')
       }
       throw new Error(`请求失败:${response.status},${response.statusText}`)
     })
        .then((data) => {
        console.log(data)
        paging.total = data.total
        tableData.value = data.data
      })
      .catch((err) => {
        console.log(err)
        ElMessage.error(err.message)
      })
  } catch (error) {
    console.error(error)
  }
}