Here is a DisplayComment function. I want to make a comment thread. Basically a reply structure kind of thing. Each parent comment is displayed in the table and I want to render its replies just below it using the same function and so on for their replies. Screenshot of Display of parent comment
function DisplayComment(commentStruct, identity) {
const comment = commentStruct.comment;
return {
oninit: (v) => {
console.log(comment.mComment);
},
view: (v) => [
m('tr', [
m('i.fas.fa-angle-right', {
class: 'fa-rotate-' + (commentStruct.showReplies ? '90' : '0'),
style: 'margin-top:12px',
onclick: () => {
commentStruct.showReplies = !commentStruct.showReplies;
// console.log(commentStruct.showReplies);
},
}),
m('td', comment.mComment),
m(
'select[id=options]',
{
onchange: (e) => {
if (e.target.selectedIndex === 1) {
// reply
util.popupMessage(
m(AddComment, {
parent_comment: comment.mComment,
channelId: comment.mMeta.mGroupId,
authorId: identity,
threadId: comment.mMeta.mThreadId,
parentId: comment.mMeta.mMsgId,
})
);
} else if (e.target.selectedIndex === 2) {
// voteUP
AddVote(
util.GXS_VOTE_UP,
comment.mMeta.mGroupId,
comment.mMeta.mThreadId,
identity,
comment.mMeta.mMsgId
);
} else if (e.target.selectedIndex === 3) {
AddVote(
util.GXS_VOTE_DOWN,
comment.mMeta.mGroupId,
comment.mMeta.mThreadId,
identity,
comment.mMeta.mMsgId
);
}
},
},
[
m('option[hidden][selected]', 'Options'),
util.optionSelect.opts.map((option) =>
m('option', { value: option }, option.toLocaleString())
),
]
),
m('td', rs.userList.userMap[comment.mMeta.mAuthorId]),
m(
'td',
typeof comment.mMeta.mPublishTs === 'object'
? new Date(comment.mMeta.mPublishTs.xint64 * 1000).toLocaleString()
: 'undefined'
),
m('td', comment.mScore),
m('td', comment.mUpVotes),
m('td', comment.mDownVotes),
]),
commentStruct.showReplies
? Data.ParentCommentMap[comment.mMeta.mMsgId]
? Data.ParentCommentMap[comment.mMeta.mMsgId].forEach(
(value) =>
Data.Comments[value.mMeta.mThreadId] &&
Data.Comments[value.mMeta.mThreadId][value.mMeta.mMsgId]
?
m(DisplayComment(
Data.Comments[value.mMeta.mThreadId][value.mMeta.mMsgId],
identity
))
: ''
)
: ''
: '',
],
};
}
I want to know why the recursive call to DisplayComment is not being rendered on the screen in the table below the parent.
forEach()
does not return anything. Used a map()
function instead of forEach()
and the replies were displayed.
Huge credits to @Barney