從下拉菜單選擇器更新顯示的項目列表react/redux

Question

我想了解如何過濾與react/redux的項目列表。我已經建立這個例子https://jsbin.com/pineyec/edit?html,console,output基於此questions

經過幾個小時和一些幫助，我終於有我的過濾器組件正常工作（我猜）。但是，如何不真正瞭解如何將我的過濾器組件與我的項目列表組件相關聯。

我想我的問題的關鍵是在下面的代碼，但我真的不明白：

// Getting visible movies from state. 
function getVisibleMovies(year, genre, rating, sorting, movies) { 
    return movies 
    .filter(m => { 
     return (
     (year == 'all' || year == m.year) && 
     (genre == 'all' || genre == m.genre) && 
     (rating == 'all' || rating == m.rating) 
    ); 
    }) 
    .sort((a, b) => { 
     if (sorting == 'year') { 
     return b.year - a.year; 
     } 
     if (sorting == 'rating') { 
     return b.rating - a.rating; 
     } 
     if (sorting == 'alphabetically') { 
     return a.title > b.title ? 1 : a.title < b.title ? -1 : 0; 
     } 
    }); 
} 

我需要建立新的動作？或新的減速機？

我的下一步應該是什麼？

謝謝。

Answer 1

你有兩個mapStateToProps函數具有相同的名稱，所以你總是調用最後一個。

變化

function mapStateToProps(state) { 
      return { 
      movies: state.moviesReducer.movies, 
      }; 
     } 

const MovieOne = connect(mapStateToProps)(Movies); 

到

function mapStateToPropsMovies(state) { 
     let {year,genre,rating,sorting,movies} = state.moviesReducer; 
     return { 
     movies: getVisibleMovies(year, genre, rating, sorting, movies) 
     }; 
} 


const MovieOne = connect(mapStateToPropsMovies)(Movies); 

jsbin working