Как правильно реализовать Reducer Notification?

Question

[Антон Измайлов]

И снова я со своими идиотскими вопросами. Все никак не могу продумать адекватное решение для создания компонента оповещений.

Необходимо при действиях создавать notification's с полями: type, text, time.
Т.е. тип оповещения, его содержимое и время жизни. Как правильно это реализовать?
Каждый раз при экшене разбирать массив this.props.layout.notifications, добавлять туда push'ем еще один элемент и по новой записывать? Если нет, то как действовать чтобы не создавать новый reducer?

Comments

[Андрей Антропов]

Уточнить в чем конкретно сложность. Не понятно без контекста

[Антон Измайлов]

Андрей Антропов: как правильно это все организовать. Сейчас имеется reducer "layout", в нем есть
state: {
notifications: []
}

Так вот, как мне добавлять туда новый notification и удалять те, которые уже закончились по времени жизни.
Каждый раз, когда мне нужно вызвать событие с уведомлением (будь то новое уведомление или удаление старого), мне нужно доставать имеющийся массив this.props.layout.notification, модифицировать его и отправлять обратно для перезаписи, или есть более красивые варианты решения?

Answer 1

[Никита Гущин]

Каждый раз, когда мне нужно вызвать событие с уведомлением (будь то новое уведомление или удаление старого), мне нужно доставать имеющийся массив this.props.layout.notification, модифицировать его и отправлять обратно для перезаписи

В корне не правильно. Работой со state\данными должен заниматься редьюсер. А вы ему должны говорить что и с чем сделать посредством экшенов.

То есть если вам нужно добавить нотификейшен - диспатчите экшен вида

dispatch({
  type: 'ADD_NOTIFICATION',
  payload: { notification: { ... } },
})

Естественно обернув все это в экшен-креатор.

Comments

[Антон Измайлов]

Есть небольшая путаница с этим. Если в action в функции начать добавлять какую-нибудь логику, то redux ругается, говоря что функция должна быть "чистой".

[Никита Гущин]

Антон Измайлов: чистым должен быть редьюсер. А вот в экшене можно много чего делать. Посмотрите пример тут Как лучше организовать редьюсер в Redux? - немного похоже на ваш случай