diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue index d848449..c06c5fc 100644 --- a/src/views/board/BoardView.vue +++ b/src/views/board/BoardView.vue @@ -5,28 +5,25 @@
- +
{{ boardTitle }}
-
+
-
@@ -42,11 +39,14 @@ import BoardProfile from '@c/board/BoardProfile.vue'; import { ref, onMounted } from 'vue'; import { useRoute, useRouter } from 'vue-router'; import axios from '@api'; +import Quill from 'quill'; +import DOMPurify from 'dompurify'; // 게시물 데이터 상태 const profileName = ref('익명 사용자'); const boardTitle = ref('제목 없음'); -const boardContent = ref('내용 없음'); +const boardContent = ref(''); +const convertedContent = ref('내용 없음'); const comments = ref([]); const attachments = ref([]); @@ -54,7 +54,6 @@ const attachments = ref([]); const route = useRoute(); const router = useRouter(); const currentBoardId = ref(Number(route.params.id)); -console.log(currentBoardId.value) // 글 수정 페이지로 이동 const goToEditPage = () => { @@ -71,7 +70,22 @@ const fetchBoardDetails = async () => { const boardDetail = data.boardDetail || {}; profileName.value = boardDetail.author || '익명 사용자'; boardTitle.value = boardDetail.title || '제목 없음'; - boardContent.value = boardDetail.content || '내용 없음'; + boardContent.value = boardDetail.content || ''; + + // Quill을 사용하여 Delta 데이터를 HTML로 변환 + if (boardContent.value) { + try { + const quillContainer = document.createElement('div'); + const quillInstance = new Quill(quillContainer); + quillInstance.setContents(JSON.parse(boardContent.value)); + convertedContent.value = DOMPurify.sanitize(quillContainer.innerHTML); + } catch (parseError) { + console.error('Delta 데이터 변환 오류:', parseError); + convertedContent.value = '내용을 표시할 수 없습니다.'; + } + } else { + convertedContent.value = '내용 없음'; + } attachments.value = data.attachments || []; comments.value = data.comments || []; @@ -83,7 +97,6 @@ const fetchBoardDetails = async () => { // 컴포넌트 마운트 시 데이터 로드 onMounted(() => { - console.log('Route Params:', route.params); fetchBoardDetails(); }); diff --git a/src/views/board/BoardWrite.vue b/src/views/board/BoardWrite.vue index 2ff95ec..a091174 100644 --- a/src/views/board/BoardWrite.vue +++ b/src/views/board/BoardWrite.vue @@ -9,36 +9,52 @@
- + - + - +
-
- +
@@ -49,114 +65,75 @@ -