Javascript 带有React和Redux的收藏夹购物车

你好，我制作了一个收藏夹组件来添加通过API获得的电影。我使用Redux将电影添加到收藏夹组件，但目前我只得到一个整数。我想检索有关添加的电影标题、描述、照片等的所有信息。。并将其显示在“我的收藏夹”组件中

下面是我的收藏夹组件，用于检索收藏夹电影：

我的组件将电影添加到最喜爱的组件我删除了一些代码，以便更好地理解： 目前，它发送一个整数onClick={=>addMovie1}

render() {
    const { classes } = this.props;
    const { addMovie } = this.props;
    const theMovies = this.state.films.map((film) => {
      return(
        <Grid key={film.id} item xs={6} sm={6} md={3} lg={3}>
          <Card className='container-card-poster'>
                <figcaption className='fig-caption'>
                  <h4 className={classes.titleOverlay}>{film.title}</h4>
                </figcaption>
                  <Tooltip 
                    TransitionComponent={Zoom}
                    id="Add to favorite"
                    title={<p>Add to favorite</p>}
                    placement={window.innerWidth > 959 ? "top" : "top"}
                  >
                    <Favorite onClick={() => addMovie(1)} className={classes.iconsHoverFav} />
                  </Tooltip>
          </Card>
        </Grid>

我不知道在添加电影时如何获得所有信息，所以如果有人能帮助我，那就太好了

---

祝大家度过愉快的一天。

将数据存储在Redux中非常有用。所以您应该有一个reducer，当key是一个电影ID并为电影本身赋值时，它将电影存储在JS对象中。因此，您可以为喜爱的电影制作一个减缩器，它只存储它们的ID

因此，在这种情况下，您的电影将存储为：

{
  1: { name: "The Shawshank Redemption", year: 1994 },
  2: { name: "The Godfather", year: 1972 },
  3: { name: "The Dark Knight", year: 2008 }
}

收藏夹为：

[ 1, 3 ]

---

当您必须使用喜爱的电影渲染组件时，您可以通过id获取该组件。

我不确定您在谈论哪些信息，请您解释一下好吗？您好@NazarLitvin，很抱歉耽搁了。我说的是电影的信息，比如片名、日期、概述、图片等等。。目前我只能得到一个整数。我在onClick中传递函数addMovie，并使用整数作为值。我想用电影的信息替换这个整数，但我不知道怎么做..根据我从代码中了解的情况，你可以用电影替换call addMovie，而不是这里的1 onClick={=>addMovie1}。但我不清楚为什么要在组件状态下存储胶片。稍后，我将使用代码示例更新我的答案，因此它可能会对您有所帮助。感谢您的帮助@NazarLitvin，我已将call addMovie替换为film，而不是1，并且我在我的收藏夹组件中制作了一个.map以显示添加的电影的信息。我不知道你是否在谈论同样的事情，但我将电影存储在我的组件状态，以显示我通过API获得的所有电影，带有.map。我可以请你共享一段发出此API请求的代码吗？

const mapDispatchToProps = dispatch => ({
  addMovie: (movie) => dispatch(addMovie(movie))
});
const mapStateToProps = state => ({
  ...state
})
TopFilms.propTypes = {
  classes: PropTypes.object
};

{
  1: { name: "The Shawshank Redemption", year: 1994 },
  2: { name: "The Godfather", year: 1972 },
  3: { name: "The Dark Knight", year: 2008 }
}

[ 1, 3 ]