diff --git a/src/views/board/BoardView.vue b/src/views/board/BoardView.vue
index 6345383..f655bfc 100644
--- a/src/views/board/BoardView.vue
+++ b/src/views/board/BoardView.vue
@@ -5,17 +5,17 @@
@@ -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([]);
@@ -70,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 || [];
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 @@