1. 所有接口都是以 http://love.liushuaiyang.com 开头的
  2. 所有接口都没有处理跨域，如果要在vue项目中使用 ， 需要配置跨域，详细看：

vue项目中配置跨域

比赛相关接口：

返回的数据信息：

字段 类型 备注
id int 城市id
cityName string 城市名称
totalConsumption int 总消费额
month int 月份
provinceId int 省份id
provinceName string 省份名称

1.根据传入的月份获取对应月份的城市消费数据

url：/api/city/getData
请求方式：**POST**
请求参数：

字段 类型 是否必须 备注
start string 是 起始月份
end string 是 结束月份

请求示例：

  1. 使用axios 发送 post 请求 ```javascript mounted(){ axios.post(‘/api/city/getData’,{ start:”02”, end:”06” }).then(res =>{ console.log(res) }) }

//使用async await关键字 async mounted(){ const resp = await axios.post(‘/api/city/getData’,{ start:”02”, end:”06” }) console.log(resp) }

  2. 2. 使用`fetch` api（H5中新增的发送网络请求的api） 发送 `post` 请求
  3. ```json
  4. mounted(){
  5.   fetch('/api/city/getData',{
  6.       method:"POST",
  7.     body:JSON.stringify({
  8.          start:"02",
  9.          end:"06"
  10.     }),
  11.       headers:{
  12.             "Content-Type":"application/json"
  13.         }
  14.   })
  15.     .then(res => res.josn())
  16.     .then(data => console.log(data))
  17. }
  19. //使用async await关键字
  20. async mounted(){
  21.     const resp = await fetch('/api/city/getData',{
  22.       method:"POST",
  23.     body:JSON.stringify({
  24.          start:"02",
  25.          end:"06"
  26.     }),
  27.       headers:{
  28.             "Content-Type":"application/json"
  29.         }
  30.   })
  31.     .then(res => res.josn());
  32.     console.log(resp);
  33. }

返回：

  1. {
  2.     "msg": "获取数据成功",
  3.   data: [
  4.         {
  5.             "id": 4,
  6.             "cityName": "阿克苏地区",
  7.             "totalConsumption": 87658,
  8.             "month": 2,
  9.             "provinceId": 6,
  10.             "provinceName": "澳门特别行政区"
  11.         },
  12.         {
  13.             "id": 23,
  14.             "cityName": "广安市",
  15.             "totalConsumption": 52530,
  16.             "month": 4,
  17.             "provinceId": 4,
  18.             "provinceName": "江西省"
  19.         },
  20.     ...
  21. }

2.根据城市id查询到某个城市的数据

url：/api/city/:id
:id 就是 你要查询的 城市id
请求方式：GET
请求参数：无
请求示例：
使用 axios 发送 get 请求

  1. mounted(){
  2.   //请求 id 为 3 的城市消费数据
  3.   axios.get('/api/city/3').then(res =>{
  4.     console.log(res)
  5.   })
  6. }
  8. //使用async await关键字
  9. async mounted(){
  10.     const resp = await axios.post('/api/city/3')
  11.   console.log(resp)
  12. }

返回：

  1. {
  2.     "data": {
  3.         "id": 3,
  4.         "cityName": "山南地区",
  5.         "totalConsumption": 72731,
  6.         "month": 5,
  7.         "createdAt": "2022-01-03T11:58:35.000Z",
  8.         "updatedAt": "2022-01-03T11:58:35.000Z",
  9.         "deletedAt": null,
  10.         "ProvinceId": 6
  11.     },
  12.     "msg": "查询成功"
  13. }

love 接口

一见钟情

url：/api/love/lsy 或者 /api/love/sjm
请求方式：GET
请求参数：无
请求示例：
使用 axios 发送 get 请求

  1. mounted(){
  2.   axios.get('/api/love/lsy').then(res =>{
  3.     console.log(res)
  4.   })
  5. }
  7. //使用async await关键字
  8. async mounted(){
  9.     const resp = await axios.post('/api/love/lsy')
  10.   console.log(resp)
  11. }

返回：
fall in love at first sight

最好的我们

url：/api/love/lsy&sjm
请求方式：GET
请求参数：无
请求示例：
使用 axios 发送 get 请求

  1. mounted(){
  2.   axios.get('/api/love/lsy&sjm').then(res =>{
  3.     console.log(res)
  4.   })
  5. }
  7. //使用async await关键字
  8. async mounted(){
  9.     const resp = await axios.post('/api/love/lsy&sjm')
  10.   console.log(resp)
  11. }

返回：
刘帅洋 & 史佳美