좋아요 싫어요 버튼 수정

src/components/board/BoardComment.vue

@@ -1,10 +1,10 @@
 <template>
     <div>
         <BoardProfile :profileName="comment.author" :showDetail="false" :author="true" />
-        <div class="my-6">
-            <p>{{ comment.content }}</p>
+        <div class="mt-6">
+            <p class="m-0">{{ comment.content }}</p>
         </div>
-        <PlusButton v-if="isPlusButton" @click="toggleComment"/>
+        <PlusButton v-if="isPlusButton" @click="toggleComment" class="mt-6"/>
         <BoardComentArea v-if="isComment" @submit="submitComment"/>
         
         <!-- 대댓글 -->
@@ -12,7 +12,7 @@
             <li
                 v-for="child in comment.children"
                 :key="child.id"
-                class="pt-6 ps-10"
+                class="pt-8 ps-10"
             >
                 <BoardComment :comment="child" :isPlusButton="false" @submitComment="addChildComment" />
             </li>

src/components/board/BoardCommentList.vue

@@ -3,7 +3,7 @@
         <li
             v-for="comment in comments"
             :key="comment.id"
-            class="mt-6"
+            class="mt-8"
         >
             <BoardComment :comment="comment" @submitComment="addComment" />
         </li>

src/components/board/BoardProfile.vue

@@ -10,13 +10,13 @@
                     <span>2024.12.10 10:46</span>
                     <template v-if="showDetail">
                         <span>
-                            <i class="fa-regular fa-eye"></i> 1
+                            <i class="fa-regular fa-eye"></i> {{ views }}
                         </span>
                         <span>
-                            <i class="fa-regular fa-thumbs-up"></i> 1
+                            <i class="fa-regular fa-thumbs-up"></i> {{ likes }}
                         </span>
                         <span>
-                            <i class="fa-regular fa-thumbs-down"></i> 1
+                            <i class="fa-regular fa-thumbs-down"></i> {{ dislikes }}
                         </span>
                     </template>
                 </div>
@@ -55,7 +55,7 @@ import BoardRecommendBtn from '../button/BoardRecommendBtn.vue';
 const router = useRouter();
 
 // Props 정의
-defineProps({
+const props = defineProps({
     profileName: {
         type: String,
         default: '익명',
@@ -72,6 +72,18 @@ defineProps({
         type: Boolean,
         default: false,
     },
+    views: {
+        type: Number,
+        default: 0,
+    },
+    likes: {
+        type: Number,
+        default: null,
+    },
+    dislikes: {
+        type: Number,
+        default: null,
+    },
 });
 
 const boardId = 100; //수정필요!!

src/views/board/BoardView.vue

@@ -5,7 +5,11 @@
                 <div class="card">
                     <!-- 프로필 헤더 -->
                     <div class="card-header">
-                        <BoardProfile :boardId="currentBoardId" :profileName="profileName" class="pb-6 border-bottom" />
+                        <BoardProfile
+                            :boardId="currentBoardId"
+                            :profileName="profileName"
+                            class="pb-6 border-bottom"
+                            />
                     </div>
                     <!-- 게시글 내용 -->
                     <div class="card-body">