springboot+vue的多级评论

实现多级评论需要在后端和前端两个方面进行处理。

在后端，你需要定义一个评论的数据结构，可以使用递归方式来处理多级评论。每个评论对象应该包含评论的内容、评论的时间、评论者的信息以及子评论列表。子评论列表也是一个评论对象的集合，可以使用 List 或者 Set 来实现。

在前端，你需要使用递归组件来展示多级评论。可以定义一个 Comment 组件来展示一个评论对象，如果这个评论对象包含子评论，那么在 Comment 组件中递归调用 Comment 组件来展示子评论。

以下是一个简单的示例代码：

后端 Java 代码：

public class Comment {
    private String content;
    private LocalDateTime time;
    private User user;
    private List<Comment> children;
    // getters and setters
}

前端 Vue 代码：

<template>
  <div class="comment">
    <div class="content">{{ comment.content }}</div>
    <div class="time">{{ comment.time }}</div>
    <div class="user">{{ comment.user.name }}</div>
    <div class="children">
      <comment v-for="child in comment.children" :comment="child" :key="child.id"></comment>
    </div>
  </div>
</template>

<script>
export default {
  name: "Comment",
  props: {
    comment: {
      type: Object,
      required: true
    }
  },
  components: {
    Comment: () => import("./Comment.vue")
  }
};
</script>

在这个示例中，我们使用了递归组件 Comment 来展示多级评论。如果当前评论对象包含子评论，那么在 Comment 组件中递归调用 Comment 组件来展示子评论。