Javascript onClick在使用firestore和React、redux安装组件时立即启动

我有一个组件，它显示一个项目。对于每个项目，都有一个删除按钮，但由于某种原因，我所有项目的删除按钮都会立即被“按下”。 为什么会发生这种情况？我正在使用redux和firestore。我认为这可能与实时侦听器有关，但在向数据库添加数据方面没有任何问题

Projects.js

  componentDidMount = () => {
    this.props.projectActions.registerProjectListener();
  };

  renderProjects = () => {
    const { projects } = this.props.projects;
    const { classes, projectActions } = this.props;
    return (
      <Paper elevation={0} square={true} className={classes.projectPaper}>
        <Box fontSize="h5.fontSize" textAlign="center">
          Your Projects:
        </Box>
        {projects &&
          projects.map(project => {
            return <Project {...{ key: project.id, project, projectActions }}></Project>;
          })}
        <Grid container className={classes.grid} direction="row" justify="flex-end" alignItems="center">
          <AddProject {...{ projectActions }}></AddProject>
        </Grid>
      </Paper>
    );
  };

---

您需要传递对函数的引用。使用以下命令更新IconButton组件

<IconButton 
    onClick={() => projectActions.deleteProject(project.id)}>
    <ClearIcon></ClearIcon>
</IconButton>

projectActions.deleteProject（project.id）}>

export const deleteProject = id => {
  return dispatch => {
    console.log(db.collection("projects").doc(id));
    // db.collection("projects")
    //   .doc(id)
    //   .delete();
    dispatch({ type: ActionTypes.DELETE_PROJECT });
  };
};

export const registerProjectListener = () => {
  let projects = [];
  return dispatch => {
    db.collection("projects").onSnapshot(snapshot => {
      snapshot.docChanges().forEach(change => {
        if (change.type === "added") {
          console.log(change.doc.data());
          projects.push({ ...change.doc.data(), ...{ id: change.doc.id } });
        } else if (change.type === "removed") {
          // projects.filter(()=> )
        }
      });
      dispatch({ type: ActionTypes.REGISTER_LISTENER, projects: projects });
    });
  };
};

<IconButton 
    onClick={() => projectActions.deleteProject(project.id)}>
    <ClearIcon></ClearIcon>
</IconButton>