React报错：setCurrentId is not a function 问题排查求助

错误信息 #

Uncaught TypeError: setCurrentId is not a function at onClick (Post.js:19:1)

问题原因 #

你的Posts.js组件未添加导出语句，导致App.js无法正确引入该组件，进而setCurrentId函数没有被正常传递到子组件Post中，最终触发点击事件时的类型错误。

解决方案 #

在Posts.js文件末尾添加组件导出语句：

export default 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 ? <CircularProgress /> : (
      <Grid className={classes.container} container alignItems="stretch" spacing={3}>
        {posts.map((post) => (
          <Grid key={post._id} item xs={12} sm={6} md={6}>
            <Post post={post} setCurrentId={setCurrentId} />
          </Grid>
        ))}
      </Grid>
    )
  );
};

// 新增导出语句
export default Posts;

内容的提问来源于stack exchange，提问作者Atharv Kulkarni