Question

我是React-Redux的新手，我正在努力进行概念验证项目（电影列表），以学习Redux的基础知识。我非常擅长React，但是Redux是另一笔交易...

因此，在我的仓库中，特别是在智能组件MoviesList.jsx（https://bitbucket.org/vforvaios/react-movie-app/src/05a6241eff3a1896eca91bb1800e8e017f8b569a/src/MoviesList.jsx?at=feature%2Fadd_redux&fileviewer=file-view-default）中，我想知道如何调度正确的操作来更改每个SingleMovieItem（https://bitbucket.org/vforvaios/react-movie-app/src/05a6241eff3a1896eca91bb1800e8e017f8b569a/src/SingleMovieItem.jsx?at=feature%2Fadd_redux&fileviewer=file-view-default中的评分（递增，递减））以及实现该目标的正确减速器是什么？有人可以帮我吗？

换句话说，是显示我的意思的真实例子... 可以说有一个主应用程序，我们利用了

<Provider store={store}>
  <App />
</Provider>

然后该应用包含以下内容：

import React, { Component } from 'react';
import MoviesList from './MoviesList'

class App extends Component {
   render() {
       return (
          <div>
             <MoviesList />
          </div>
       )
   }
}

export default App;

然后，MovieList.jsd包含以下内容：

import React, { Component } from 'react';
import { addRating } from './actions';
import SingleMovieItem from './SingleMovieItem';
import { connect } from "react-redux";

const mapStateToProps = state => {
  return {
    allMovies: state
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    onIncrement: (id) => dispatch(addRating(id))
  };
};

class MovieList extends Component {
  constructor(props) {
    super(props);
  }

  handleIncrement = id => {

  }

  render() {
     return (
        <div>
           <ul className="moviesList">
              {this.props.allMovies.movies.map(movie => {
                return (
                   <SingleMovieItem
                      key={movie.id}
                      movie={movie}
                      onIncrement={this.handleIncrement(movie.id)} />
                );
              })}
           </ul>
         </div>
       )
     }
   }

   export default connect(mapStateToProps, mapDispatchToProps)(MovieList);

增加单个电影的收视率的减少因素是什么如果initialState是

const initialState = {
   movies: [
      {
         id: "1",
         title: "Harry Potter 1",
         url: "harry-1.jpg",
         rating: "2"
      },
      {
         id: "2",
         title: "Harry Potter 2",
         url: "harry-2.jpg",
         rating: "3"
      }
    ]
  };

谢谢。

创建redux reducer更改状态嵌套对象的值

0 个答案: