Redux: хранит куски состояния current-X и хранит только идентификаторы - PullRequest
Новая
       8

Redux: хранит куски состояния current-X и хранит только идентификаторы

0 голосов
/ 03 июля 2018

Пример (вы можете пропустить это)

Скажем, есть приложение, которое помогает людям организовать свою музыкальную библиотеку. Библиотека содержит Albums, каждый Album содержит отдельный Songs, каждый Song содержит популярные Quotes, которые появляются в этой песне. Для каждого из этих объектов имеется больше информации, поэтому объект Album содержит информацию об исполнителе, году и т. Д. Пользователи могут редактировать все это.

Моя проблема

Я изо всех сил пытаюсь найти наиболее эффективную стратегию для преобразования этого в Redux. Я думал о вложении всего, как albums: [ { title, songs: [etc. etc.]}, {}]

Итак, у нас есть все данные в одном объекте. Однако, если кто-то нажимает на альбом, песню и цитату, мои редукторы каким-то образом должны будут знать, что отображать и чем занимается пользователь. Я могу придумать 2 подхода к этому:

Подход 1 

{
 list: [] //contains all albums, songs, quotes as outlined above
 currentAlbum: albumId
 currentSong: songId
 currentQuote: quoteId
}

Подход 2 Разные части состояния содержат не только идентификаторы, но и весь объект: 

listReducer: [] // holds the list, same as above
currentAlbumReducer: { id: albumid12312, title: "The Eminem Show", etc... } 
currentSongReducer: { id: songid4545, song_title: "I believe", etc... }
currentQuoteReducer: { id: 12312, quote: "I'm Slim Shady", etc... }

При таком подходе я всегда перемещал вещи из списка в соответствующие «текущие» редукторы, и если кто-то что-то здесь меняет, я потом в какой-то момент обновляю списки.

Однако, это кажется немного излишним. В то же время, может ли этот подход быть быстрее, чем хранить все в одном объекте?

Буду признателен за совет, какой метод лучше и почему, и есть ли другие способы обработки состояния, которые мне не приходили в голову.

1 Ответ

0 голосов
/ 03 июля 2018

Здесь вступает в игру концепция нормализации вашего состояния . Таким образом, это, как правило, означает хранение элементов с использованием объектов в качестве таблиц поиска, идентифицированных по идентификаторам элементов, и ссылки на элементы в других местах с использованием этих идентификаторов.

Итак, в вашем случае ваше дерево состояний может выглядеть так: 

{
    albums : {
        albumid1 : {title, songs : ["songid1", "songid2"] }
    },
    songs : {
        songid1 : {title}
    },
    quotes : {
        quoteid1 : {text}
    },
    currentSelections : {
        album : "albumid1",
        song : "songid1",
        quote : "quoteid1"
    }
}
...