Воспроизведение аудиофайлов с помощью Redux

Question

Я разрабатываю приложение в React и Redux. У меня есть таймер, который отправляет действие каждую секунду, и состояние обновляется, чтобы представлять фактическое время. Теперь это отлично подходит для пользовательского интерфейса, но мне нужно играть звук в определенное время, и я не уверен, куда должна идти эта логика.

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

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

Answer 1

Как об использовании sound магазина, как это:

const initialState = { 
    currentSound: undefined 
} 

export default function sound(state = initialState, action) { 
    switch(action.type) { 
    case UPDATE_TIME: 
     const time = action.time 
     const sounds = { 
     6: '/sound1.mp3', 
     22: '/sound2.mp3', 
     99: '/sound3.mp3' 
     } 

     return Object.assign({}, state, {currentSound: sounds[time]}) 
    } 
} 

Затем в компоненте можно использовать connect из react-redux, чтобы получить состояние (state.sound.currentSound) и воспроизводить звук, если есть один. Поскольку магазин будет обновляться каждый раз, когда действие отправляется, если на тот момент нет звука, currentSound будет undefined.