经纬度信息的api开发，或者使用若依 spring boot +vue2 的经纬度api开发代码

经纬度信息的API开发通常涉及获取地理位置信息，并将其以经纬度的形式提供给前端应用。若依（Ruoyi）是一个基于Spring Boot和Vue的后台管理系统框架，可以很方便地实现这样的功能。下面是一个简单的示例代码，展示如何使用若依框架结合Spring Boot和Vue2来开发一个获取经纬度信息的API。

### 后端部分（Spring Boot）

#### 1. 创建一个新的Spring Boot项目
可以使用Spring Initializr或者IDEA等工具创建一个新的Spring Boot项目，选择Web依赖。

#### 2. 添加若依依赖
在`pom.xml`中添加若依的依赖：

<dependency>
    <groupId>com.ruoyi</groupId>
    <artifactId>ruoyi-framework</artifactId>
    <version>4.0.0</version>
</dependency>

#### 3. 创建Controller类
在`src/main/java/com/example/demo`目录下创建一个控制器类`LocationController.java`：

package com.example.demo.controller;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;

@RestController
public class LocationController {

    @GetMapping("/api/location")
    public String getLocation(@RequestParam double latitude, @RequestParam double longitude) {
        return "Latitude: " + latitude + ", Longitude: " + longitude;
    }
}

#### 4. 启动应用
运行Spring Boot应用，默认端口是8080。

### 前端部分（Vue2）

#### 1. 创建一个新的Vue项目
使用Vue CLI创建一个新的Vue项目：

vue create frontend
cd frontend

#### 2. 安装Axios
在项目中安装Axios用于发送HTTP请求：

npm install axios

#### 3. 创建组件
在`src/components`目录下创建一个新组件`Location.vue`：

<template>
  <div>
    <h1>获取经纬度信息</h1>
    <input v-model="latitude" placeholder="Latitude">
    <input v-model="longitude" placeholder="Longitude">
    <button @click="getLocation">获取位置</button>
    <p>{{ location }}</p>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      latitude: '',
      longitude: '',
      location: ''
    };
  },
  methods: {
    async getLocation() {
      try {
        const response = await axios.get('http://localhost:8080/api/location', {
          params: {
            latitude: this.latitude,
            longitude: this.longitude
          }
        });
        this.location = response.data;
      } catch (error) {
        console.error('Error fetching location:', error);
      }
    }
  }
};
</script>

#### 4. 在App.vue中使用组件
修改`src/App.vue`文件，引入并使用`Location.vue`组件：

<template>
  <div id="app">
    <Location/>
  </div>
</template>

<script>
import Location from './components/Location.vue';

export default {
  name: 'App',
  components: {
    Location
  }
};
</script>

###