Can't figure out where my mistake is. Not able to map through to display the list of blog comments. I'm using Django and react. From the code below, I tried to assess each blog post with comments using foreign key. But I'm not able to get the comment property from the blog. If I do something like {blog.title} I get the title of the blog back on the browser. Since comments are associated with each post I try to get different properties of comment from the blog object (just as I specified in the code below) but the value I'm getting is undefined. And have the following blog post and blog comment models:

class BlogComment(models.Model):
    post = models.ForeignKey(BlogPost, on_delete=models.SET_NULL, related_name="post_comment",  null=True)
    user = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.SET_NULL, related_name="user_comment", null=True)
    name = models.CharField(max_length=200, null=True, blank=True)
    comment = models.TextField(null=True, blank=True)
    dateCreated = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return str(self.user.username)

class BlogPost(models.Model):
    ...
    author = models.ForeignKey(settings.AUTH_USER_MODEL, null=True, on_delete=models.CASCADE)
    body = models.TextField()
    dateCreated = models.DateTimeField(auto_now_add=True)

And the serializers for both models are:

class CommentSerializer(serializers.ModelSerializer):
    class Meta:
        model = BlogComment
        fields = '__all__'

class BlogPostSerializer(serializers.ModelSerializer):
    comments = serializers.SerializerMethodField(read_only=True)
    class Meta:
        model = BlogPost
        fields = "__all__"

    def get_comments(self, obj):
        comments = obj.comment_set.all()
        serializer = CommentSerializer(comments, many=True)
        return serializer.data

The endpint of comment is path('posts/<str:pk>/comment/', CreateCommentView, name="create-comment"),.

The endpoint is working. I'm able to add comment to posts both from the front end. The error comes when I try to map through the comments for each post. Get the error: AttributeError: 'BlogPost' object has no attribute 'comment_set'.

Here is the code I'm using to map through to display all the blogs of a particular post in the blog details page in react. I'm assess each blog there:

<h2>{blog.title}</h2>
<img src={blog.image} />
<div variant='flush'>
                    {blog.comments.map((comment) => (
                        <div key={comment.id}>
                            <strong>{comment.name}</strong>            
                            <p>{comment.dateCreated}</p>
                            <p>{comment.comment}</p>
                        </div>
                    ))}
                </div>

Here is the code I'm using to map through to display all the blogs of a particular post in the blog details page in react. If I do not map the error does not come up and I'm able to add comment. However, in order to display the comments under each blog post I map through. How do I fix this?


You need to use post_comment:

comments = obj.post_comment.all()

You declared it here:

post = models.ForeignKey(BlogPost, on_delete=models.SET_NULL, related_name="post_comment",  null=True)

related_name is used as a name for Django relation. See more here.

But changing post_comment with something else would be a better solution for me.