Home > Blockchain >  Received NaN for the `children` attribute. If this is expected, cast the value to a string error Rea
Received NaN for the `children` attribute. If this is expected, cast the value to a string error Rea

Time:01-21

I'm new to react/firebase and I'm trying to create a like button. However when I click on the button, the like count shows up as NaN and I receive the error shown in the title. I've tried parsing the input but the NaN error still shows up and I'm not sure why.

    const LikeButton = ({ post }) => {
    
    const handleClick = async () => {
      let likeCount = post.likeCount;
  
      const date = new Date();
      
      likeCount = likeCount   1;
      
  
      await db.collection("posts").doc(post.id).set({
        createdAt: post.createdAt,
        updatedAt: date.toUTCString(),
        likeCount,
        title: post.title,
        
        
      });
    };
  
    return (
      <>
        <VStack>
          <IconButton
            size="lg"
            colorScheme='teal'
            aria-label="like"
            icon ={<BsHandThumbsUp />}
            onClick={() => handleClick()}
          />
          <Text bg="purple.100" rounded="md" w="100%" p={1}>
            {post.likeCount}
          </Text>
        </VStack>
        
      </>
    );
  };

  export default LikeButton;

CodePudding user response:

Change your likeCount variable to this:

let likeCount = post.likeCount || 0;
  • Related