댓글의 JSON 출력
본문
댓글이 아래와 같은 구조로 되어 있을 때, 이 댓글에 대한 JSON 출력을 어떤식으로 주면
프런트엔드에서 편하게 사용이 가능할까요?
아래와 같이 JSON을 받으면 쉽게 화면에 디스플레이가 가능할까요?
아니면 더 좋은 방법이 있는지요?
{
"comments": [
{
"wrId": 1,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "",
"wrContent": "댓글 1",
"comments": [
{
"wrId": 2,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 1,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "A",
"wrContent": "댓글 1-1",
"comments": [
{
"wrId": 3,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 2,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AA",
"wrContent": "댓글 1-1-1",
"comments": [
{
"wrId": 4,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 3,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AAA",
"wrContent": "댓글 1-1-1-1",
"comments": [
{
"wrId": 6,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 4,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AAAA",
"wrContent": "댓글 1-1-1-1-1",
"comments": [
{
"wrId": 8,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 6,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AAAAA",
"wrContent": "댓글 1-1-1-1-1-1",
"comments": []
},
{
"wrId": 16,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 6,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AAAAB",
"wrContent": "댓글 1-1-1-1-1-2",
"comments": []
}
]
}
]
}
]
},
{
"wrId": 5,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 2,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AB",
"wrContent": "댓글 1-1-2",
"comments": []
}
]
},
{
"wrId": 7,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 1,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "B",
"wrContent": "댓글 1-2",
"comments": [
{
"wrId": 13,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 7,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "BA",
"wrContent": "댓글 1-2-1",
"comments": []
}
]
}
]
},
{
"wrId": 9,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 2,
"wrCommentReply": "",
"wrContent": "댓글 2",
"comments": [
{
"wrId": 10,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 9,
"wrIsComment": 1,
"wrComment": 2,
"wrCommentReply": "A",
"wrContent": "댓글 2-1",
"comments": [
{
"wrId": 15,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 10,
"wrIsComment": 1,
"wrComment": 2,
"wrCommentReply": "AA",
"wrContent": "댓글 2-1-1",
"comments": []
}
]
}
]
},
{
"wrId": 11,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 3,
"wrCommentReply": "",
"wrContent": "댓글 3",
"comments": [
{
"wrId": 12,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 11,
"wrIsComment": 1,
"wrComment": 3,
"wrCommentReply": "A",
"wrContent": "댓글 3-1",
"comments": [
{
"wrId": 14,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 12,
"wrIsComment": 1,
"wrComment": 3,
"wrCommentReply": "AA",
"wrContent": "댓글 3-1-1",
"comments": []
}
]
},
{
"wrId": 17,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 11,
"wrIsComment": 1,
"wrComment": 3,
"wrCommentReply": "B",
"wrContent": "댓글 3-2",
"comments": []
}
]
}
]
}
답변 3
저라면 지금구조 좋은데요?
자바스크립로 짜면 대략 코드가 어떻게 되나요?
loop으로 돌리면서 comments가 null이면 끝나면 될것 같은데..
어느정도 이 구조가 맞다면, 데이타베이스에서 읽은 것을 저 구조로 쿠킹을 해야 됩니다.
(위의 것은 알아보기 위해서 에디터로 만들어 봤습니다.)
javascript 보단 backend 구현이 좀 편하지 않을까 싶은데요..
vue 나 react 작업이신가요?
php 라면 그냥 php 로 작업하심이 편할듯 하네요
javascript 라면 depth 와 wr_id 기준으로 한바퀴 돌리면 되지 않을까요?
REST로 free/1/comments로 읽었을 때의 예입니다.
프런트엔드에서 쉽게 사용할 수 있는 구조면 됩니다.
저라면..
그냥
wrCommentParent 와
wrCommentReply로 구분이 되니
1.댓글
대댓글11
대대댓글111
구조로 리스트만 나열해서
wrCommentReply 의 length로
들여쓰기 깊이로만 로만 처리를 하는게 낫지 않을까 생각합니다.
{
"comments": [
{
"wrId": 1,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "",
"wrContent": "댓글 1",
},
{
"wrId": 2,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "A",
"wrContent": "댓글 1",
},
{
"wrId": 2,
"wrReply": "",
"wrParent": 1,
"boTable": "free",
"wrCommentParent": 0,
"wrIsComment": 1,
"wrComment": 1,
"wrCommentReply": "AA",
"wrContent": "대댓글 1",
},
}
형태로..말이죠
wrCommentReply도 없다고 봐야 됩니다. 글이 쓰여진 순서는 wrID 번호 순인데,
아래에서 쉽게 디스플레이할 수 있는 구조로 만들어 보고 싶습니다.
"wrComment": 1, // 이것이 comments의 length 역할을 하니까
recursive-loop 돌릴 때 유용하지 않을까요?
"wrCommentReply": "",
"wrContent": "댓글 1",
"comments": []
wrComment는 현재 있는 필드라서 그냥 포함해 논 것인데, 아마도 내려갈때는 빠질 것 같습니다.
(필요없을 것 같은 느낌.)
더 이상 나은 구조은 없을 듯 보이네요. ^^
구조가 맞는다면, 내일부터 백엔드 작업을 해 보겠습니다.
free/[wr_id]/comments
답변을 작성하시기 전에 로그인 해주세요.
