У меня есть множество фильмов разных жанров. Используя React, как лучше всего перебрать этот массив объектов и сгруппировать их по жанру?
Желаемый результат:
import _ from 'lodash'
const movieList = [
{
"genres": ["Action","Crime","Drama"],
"title": "Movie 1"
},
{
"genres": ["Action","Comedy"],
"title": "Movie 2"
},
{
"genres": ["Drama","Horror"],
"title": "Movie 3"
},
{
"genres": ["Crime","Drama"],
"title": "Movie 4"
},
{
"genres": ["Action","Crime","Horror"],
"title": "Movie 5"
}
]
export default function Home() {
const [movies, setMovies] = useState(movieList)
return (
// return movies listed by genre
)
}
Преобразование данных, подобное этому, — это то, для чего предназначен .reduce
:
movieList.reduce((acc, curr) => {
curr.genres.forEach(genre => acc[genre] ? acc[genre].push(curr.title) : acc[genre] = [curr.title]);
return acc;
}, {});