CODEWITHSUNDEEP
reactjs
Иван
Иван

Reputation: 55

How to sort a component in React

I have an element of the sidebar, on the page of my application I want to sort them by the number of likes. How can I implement sorting at the stage of the map operation, so that the components are drawn correctly?

 return (
        <section>
            <Popular/>
            <div>
                {this.props.object.map((summary, i) =>
                    <SideBarPost id={summary.id}
                                 firstName={summary.User.firstName}
                                 lastName={summary.User.lastName}
                                 title={summary.title}
                                 createdAt={summary.createdAt}
                                 likes={summary.likes.length}
                                 key={i}
                    />)
                }
            </div>
         </section>

Upvotes: 1

Views: 534

Answers (2)

DianaS pencer
DianaS pencer

Reputation: 1

const filter1 = [...users].sort((a,b)=> a.name.localeCompare(b.name)) setUsers(filter1)

Upvotes: 0

Иван
Иван

Reputation: 55

Hassan Imam's solution in the comments helped:

You can use something like this this.props.object.sort((a,b) => b.likes.length - a.likes.length).map(/*component logic here*/);

Upvotes: 1

Related Questions