Question

所以我要执行此操作：

export const getMovieDettails = (id) => (dispatch) => {
    dispatch({type: GET_MOVIE_DETTAIL_LOADING})
    fetch(`api/movieId/${id}`)
        .then(response => response.json())
        .then(movie => dispatch({type: GET_MOVIE_DETTAIL_LOADED, payload: movie}))
        .catch(err => dispatch({type: GET_MOVIE_DETTAIL_FAIL, payload: "Error with API"}));
}

在App.js上，我这样做：

const mapDispatchToProps = (dispatch) => {
  return {
    onGetShows: () => dispatch(getHomeShows()),
    onGetMovies: () => dispatch(getMoviesShows()),
    onGetSeries: () => dispatch(getSeriesShows()),
    onGetMovieDettail: (id) => dispatch(getMovieDettails(id))
  }
}

然后将函数传递给

<Route path="/movie/:id"  render={(routeProps) => <MovieDettailsRouter key={routeProps.match.params.id} data={this.props.movieDettail} movieDettail={this.props.onGetMovieDettail} {...routeProps}/>}/>

我在MovieDettailRouter上也这样做

componentDidMount() {
        console.log(this.props.match.params.id);
        this.props.movieDettail(this.props.match.params.id);
    }

但不起作用，如何通过参数传递函数，出于良好的体验，我在App.js上调用了所有状态和动作，然后在组件上传递了数据，在没有参数的情况下进行调用我没有问题，一切都很好，但是在这里我需要获取动作问题的参数，在App v1上，我不对该页面使用动作，我仅用于不带参数动作的页面，但是在此更新中，我决定使用redux对于服务器上的每个调用，我需要了解如何通过组件上的带有参数的动作

编辑：在MovieDettailRoute上添加状态

Answer 1

您似乎没有将状态传递给MovieDetailsRouter组件。在获取，分发和存储更改数据之后，正在侦听该存储部分的所有组件都将更新。组件需要访问状态才能获取数据。

您可以通过在App组件中获取操作将通过mapStateToProps更新的状态部分，将数据传递给组件，然后将其传递给MovieDetailRouter

React-redux：带变量的动作

1 个答案: