如何在已创建的Java项目中搭建mongoDB并用VUE展现出来

要在Java项目中使用MongoDB，你需要遵循以下步骤：

1. 安装MongoDB：在官网下载MongoDB并按照说明进行安装。

2. 添加MongoDB的Java驱动程序：你可以使用Maven或Gradle添加MongoDB的Java驱动程序。

3. 在Java项目中连接MongoDB：使用Java驱动程序连接MongoDB，并在Java代码中实现CRUD操作。

4. 创建REST API：将MongoDB数据暴露为REST API，以便从前端应用程序中访问。

5. 创建Vue应用程序：使用Vue框架创建前端应用程序，并将其链接到后端REST API。

以下是具体步骤：

1. 安装MongoDB

请参考MongoDB的官方文档进行安装。

2. 添加MongoDB的Java驱动程序

如果你使用Maven，则可以在pom.xml文件中添加以下依赖项：

<dependency>
    <groupId>org.mongodb</groupId>
    <artifactId>mongodb-driver-sync</artifactId>
    <version>4.1.0</version>
</dependency>

如果你使用Gradle，则可以在build.gradle文件中添加以下依赖项：

implementation 'org.mongodb:mongodb-driver-sync:4.1.0'

3. 在Java项目中连接MongoDB

在Java代码中连接MongoDB，你需要使用MongoClient类。以下是一个简单的示例：

import com.mongodb.client.MongoClients;
import com.mongodb.client.MongoClient;
import com.mongodb.client.MongoDatabase;

public class MongoConnection {
    private static final String DATABASE_NAME = "mydatabase";
    private static final String CONNECTION_STRING = "mongodb://localhost:27017";

    public static MongoDatabase getDatabase() {
        MongoClient mongoClient = MongoClients.create(CONNECTION_STRING);
        return mongoClient.getDatabase(DATABASE_NAME);
    }
}

此代码创建一个MongoDB客户端对象，并返回指定的数据库对象。

4. 创建REST API

使用Spring Boot创建REST API，并使用MongoDB驱动程序实现CRUD操作。以下是一个简单的示例：

@RestController
@RequestMapping("/api")
public class MyController {
    @Autowired
    private MyRepository repository;

    @GetMapping("/items")
    public List<Item> getItems() {
        return repository.findAll();
    }

    @PostMapping("/items")
    public Item addItem(@RequestBody Item item) {
        return repository.save(item);
    }

    @DeleteMapping("/items/{id}")
    public void deleteItem(@PathVariable String id) {
        repository.deleteById(id);
    }
}

@Repository
public interface MyRepository extends MongoRepository<Item, String> {
}

此代码创建一个REST API，用于获取、添加和删除MongoDB中的文档。

5. 创建Vue应用程序

使用Vue框架创建前端应用程序，并将其链接到后端REST API。以下是一个简单的示例：

<template>
  <div>
    <ul>
      <li v-for="item in items" :key="item.id">{{ item.name }}</li>
    </ul>
    <input v-model="newItemName" />
    <button @click="addItem">Add</button>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  data() {
    return {
      items: [],
      newItemName: '',
    };
  },
  created() {
    this.getItems();
  },
  methods: {
    getItems() {
      axios.get('/api/items').then((response) => {
        this.items = response.data;
      });
    },
    addItem() {
      axios.post('/api/items', { name: this.newItemName }).then(() => {
        this.getItems();
      });
    },
  },
};
</script>

此代码创建一个Vue组件，用于获取、添加和删除MongoDB中的文档。它使用Axios库发出HTTP请求。