Sort wordpress comment list to get tree view in ES6
Rus
Eng
Сортировка списка комментариев Wordpress для получения древовидного списка на ES6
Order site
By contacting me you will receive a reliable and knowledgeable contractor who will quickly and efficiently implement any task for you and your business.

All English-language materials have been translated fully automatically using the Google service

Wordpress is a great CMS, but I had to struggle to sort the comments in a tree-like order. Thanks to Kobe on stackoverflow for the awesome ES6 sorting feature

We have an array as input

Unsorted array of comments

We transform it using the function:

  var comments = this.props.data.COMMENTS;

comments = comments.sort ((a, b) => b.comment_parent - a.comment_parent);

const sortComments = (comments) => {
var temp = [... comments];

comments.forEach ((o, index) => {
if (temp [0] .comment_parent === 0) {return;}
var parentIndex = temp.findIndex (o => o.comment_ID === temp [0] .comment_parent);

if (typeof temp [parentIndex]! = "undefined") {
temp [parentIndex] .children? temp [parentIndex] .children.push (temp [0]): temp [parentIndex] .children = [temp [0]];
temp.shift ();
}


});

return temp;
}  

And we get the output:

Sorted array of comments

To display comments recursively, you can use example 0xD34F with qna.habr.com

Repost material:

Comments

There are no comments yet, you can be the first to leave it

Leave a comment

The site uses a comment pre-moderation system, so your message will be published only after approval by the moderator

You are replying to a user's comment

Send

FEEDBACK

Email me

Please message me to discuss the task. I work remotely and officially (as a self-employed professional); my hourly rate is 1,800 RUB, and I can dedicate 3–4 hours a day to the project. I respond quickly, and the consultation is free.

An error occurred while sending, please try again after a while
Message sent successfully

Phones

+7(993) 007-18-96

Email

info@tichiy.ru

Address

Россия, г. Москва

By submitting the form, you automatically confirm that you have read and accept the Privacy Policy site