vuejs 前端和服務端交互api接口定義範例

記錄一下學習過程中，vuejs 前後端api接口定義的範例(包含增刪改查)，供後面學習參考：

import request from "@/utils/request";
import axios from "axios";
const  BASE_URL="http://192.168.1.1:39090/api/v1";//定義公共url,調用時，會把BASE_URL和方法中的url 進行拼接

export function fetchclientList(query) { // 查詢列表
  return axios.request({
    url: '/client-device/list',
    method: 'post',
    baseURL:BASE_URL,
    data:query
  });
  
}

export function createClient(data) {  // 新增
  return axios.request({
    url: '/client-device/',
    method: 'post',
    baseURL:BASE_URL,
    data  // 此處可以寫成：data:data,如果函數參數爲data,此處可以只寫一個data.
  });
 
}
 
export function updateClient(data) {// 編輯
  return axios.request({
    url: '/client-device/'+ data.id + "/",
    method: 'patch',
    baseURL:BASE_URL,
    data
  });
  
}

export function getClientDetail(data) { // 查看單個詳情
  return axios.request({
    url: '/client-device/'+ data.id + "/",
    method: 'get',
    baseURL:BASE_URL,
    data
  });
}

export function deleteClient(data) { // 刪除
  return axios.request({
    url: '/client-device/'+ data.id + "/",
    method: 'delete',
    baseURL:BASE_URL,
    data
  });
 
}