vue3论坛 评论和回复

经人指点，又有了新的方法（分表，评论表和回复表），之前想法是在一个表里，没想到数据库的知识

这是前端一级评论和回复（二级及以上）所接收到的样子

let commentList = reactive<Comment[]>(
  [
    {
      itemId: 这个用来区别帖子,
      createdAt: 创建时间,
      userInfo: {这里封装一下用来存放一级评论用户的信息
        avatarUrl: 头像,
        nickname: 名字,
        userId: 
      },
      userCommentId: 评论Id,
      userId: ,
      isDel: 是否删除,
      content: 内容,
      updatedAt: 回复时间,
      showReply: 展示回复框
    },
   
  ]
);

let replyList = reactive<Comment[]>(
  [
    {
      userInfo: {这是回复者信息
        avatarUrl: ,
        nickname: ,
        userId: 
      },
      toUserInfo: {这是被回复者信息
        avatarUrl: ,
        nickname: ,
        userId: 
      },
      replyId: ,
      userId: ,
      userCommentId: ,这里识别是那条一个评论
      toUserId: ,
      content: ',
      updatedAt: ,
      showReply: 
    }
  ]
);

回复的话这里判断一下

<div class="flex items-center mb-1" v-show="item.userId !== reply.toUserId">
                    <div>
{{reply?.userInfo?.nickname || '默认昵称'}} @ {{reply?.toUserInfo?.nickname || '默认昵称'}}</div>
 </div>
<div class="flex items-center mb-1" v-show="item.userId === reply.toUserId">
      <div>{{reply?.userInfo?.nickname || '默认昵称'}}</div>
 </div>