How to render an object from an array in MongoDB and react

Question

I'm not sure how to render an object from an array into react.

My MongoDB schema is

const postSchema = new mongoose.Schema({
    userID: { type: String },
    dateTime: { type: Date, default: Date.now },
    comments: [{
        userID: { type: mongoose.Schema.Types.ObjectId, ref: 'User' },
        likes: { type: Number, default: 0 },
    }],
})

In react, I want to render just dateTime and likes.

function Post(post) {
    const {dateTime, likes } = post;
    return (
        <tr>
            <td>
                {dateTime}
            </td>
            <td>
                {likes}
            </td>
         
        </tr>
    );
  }

dateTime works fine and renders the data but Likes does not render anything. I have tried {comments.likes} but an error shows: Error: Objects are not valid as a React child (found: object with keys {dateTime, likes}). If you meant to render a collection of children, use an array instead.

function Post(post) {
    const {dateTime, comments.likes } = post;
    return (
        <tr>
            <td>
                {dateTime}
            </td>
            <td>
                {comments.likes}
            </td>

        </tr>
    );
  }

Does anyone know how to render "likes" so I can display them in react? Thank you so much in advance.

Shyam · Accepted Answer · 2021-05-23 19:03:20Z

1

comments is an Array of object . So we need to iterate over to render the likes. Assuming you need to show the likes of the Post by summing up all the likes within the comments .

const {dateTime, comments} = post;

const getLikes = () => {
  const likes = comments.reduce((totalLikes, comment) =>  totalLikes + comment.likes , 0);
  return likes;
}

return (
  <tr>
      <td>
          {dateTime}
      </td>
      <td>
          {getLikes()}
      </td>
  </tr>
);

answered May 23, 2021 at 19:03

Shyam

5,5071 gold badge15 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to render an object from an array in MongoDB and react

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related