adrianhajdin / project_mern_memories

This is a code repository for the corresponding video tutorial. Using React, Node.js, Express & MongoDB you'll learn how to build a Full Stack MERN Application - from start to finish. The App is called "Memories" and it is a simple social media app that allows users to post interesting events that happened in their lives.
https://youtube.com/playlist?list=PL6QREj8te1P7VSwhrMf3D3Xt4V6_SRkhu
5.02k stars 1.84k forks source link

TypeError: setCurrentId is not a function #46

Open mesushant13 opened 3 years ago

mesushant13 commented 3 years ago

TypeError: setCurrentId is not a function onClick E:/project1/client/src/components/Posts/Post/Post.js:23 20 | <Button 21 | style={{ color: 'white' }} 22 | size="small"

23 | onClick={() => setCurrentId(post._id)}> | ^ 24 |

25 |
26 | {post.tags.map((tag) => #${tag})}

ram-kp commented 3 years ago

even i am facing the same exact problem. have you found the solution. i would be grateful if you share.

mesushant13 commented 3 years ago

yeah I found it it's just a bracket issue

On Thu, Jul 1, 2021 at 12:32 PM ram pandey @.***> wrote:

even i am facing the same exact problem. have you found the solution. i would be grateful if you share.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/adrianhajdin/project_mern_memories/issues/46#issuecomment-871980455, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALHFB4UJYUXRSP6SHNBDEZDTVQHH7ANCNFSM47BYSUGQ .

syedasifali548 commented 3 years ago

@mesushant13 Have you found that issue? tell me plzz

ashxmaker commented 3 years ago

In clear() function of client/src/components/Form/Form.js

const clear = () => { setCurrentId = 0; //<==========Solution setPostData({ creator: "", title: "", message: "", tags: "", selectedFile: "", }); };

Hyman1993 commented 2 years ago

I am facing the same problem. finally I just found that I made a mistake. {} => [] it's const [currentId, setCurrentId] = useState(0); not const {currentId, setCurrentId} = useState(0);

MatinT-SA commented 2 years ago

You need to pass the props to other components inside the curly braces => {} Something like this: const Posts = ({ setCurrentId }) => { // Our Code.... }

If you forget to type those curly braces there, you'll face the same error I was getting :)

GuyTdev commented 2 years ago

TypeError: setCurrentId is not a function onClick E:/project1/client/src/components/Posts/Post/Post.js:23 20 | <Button 21 | style={{ color: 'white' }} 22 | size="small"

23 | onClick={() => setCurrentId(post._id)}> | ^ 24 | 25 | 26 | {post.tags.map((tag) => #${tag})}

make sure you pass the right setCurrentId as an argument from App.js and from Posts.js: I also had the same issue-> the problem was that I misspelled setCurrentId(I forgot a 't'. I wrote setCurrenId instead of setCurrentId) in App.js. It took some time to catch that, hope it will help somebody

PamelaCaguana commented 2 years ago

I am getting TypeError: a.map is not a function it points to map() this in the code and I cannot figure what I am doing wrong. Please help. I just finished part 3. Thank you!

client/components/Posts/Posts.js import React from 'react'; import { Grid, CircularProgress } from '@material-ui/core'; import { useSelector } from 'react-redux'; import Post from './Post/Post'; import useStyles from './styles';

const Posts = ({ setCurrentId }) => { const posts = useSelector((state) => state.posts); const classes = useStyles();

return ( !posts.length ? : (

{posts?.map((post) => ( ))}
)

); };

export default Posts;

MatinT-SA commented 2 years ago

@PamelaCaguana I think you need to destructure the posts like this: const { posts } = useSelector((state) => state.posts);

GuyTdev commented 2 years ago

I am getting TypeError: a.map is not a function it points to map() this in the code and I cannot figure what I am doing wrong. Please help. I just finished part 3. Thank you!

client/components/Posts/Posts.js import React from 'react'; import { Grid, CircularProgress } from '@material-ui/core'; import { useSelector } from 'react-redux'; import Post from './Post/Post'; import useStyles from './styles';

const Posts = ({ setCurrentId }) => { const posts = useSelector((state) => state.posts); const classes = useStyles();

return ( !posts.length ? : ( {posts?.map((post) => ( ))} ) ); };

export default Posts;

Try to replace this line: return ( !posts.length ? : ( {posts?.map((post) => ( ))} )

with-> return ( !posts.length ? : ( {posts.map((post) => ( ))} )

PamelaCaguana commented 2 years ago

With both servers not running locally, the front end doesn't treat my data as an array and map() is an array method. Since my posts are not loading properly the site breaks. I'm going to continue on. I tried both suggestions but they didn't do it for my particular repo.

Thank you for your help!