Tiptap 에디터로 작성된 컨텐츠를 getHTML로 받아서 저장된 게시물을 표현해보니 <p>태그가 빈 값일 때, 줄띄움이 적용되지 않고 있어 수정해봤습니다.
#
Vue 컴포넌트
<template>
...
<div class="tiptap-view" v-html="data.detail"></div>
...
</template>
v-html : https://kr.vuejs.org/v2/guide/syntax.html#%EC%9B%90%EC%8B%9C-HTML
css 작성
min-height로 최소 높이를 주었더니,
1
2
3
4
5
6
7
8
9
...
&.tiptap-view {
p {
min-height: 1.5rem;
}
}
...
깔꿈하게 성공했네욤 😆 👏👏👏
