Я относительно новичок в React и Redux, но у меня есть базовое понимание того, как работают действия + хранилище + редукторы, чтобы обеспечить односторонний поток данных.
Одна проблема, с которой я столкнулся при написании своего фактического приложения, заключается в том, как отображать предупреждения об ошибках ровно один раз для каждой уникальной ошибки.
Решение, которое я придумал, работает довольно хорошо, но я чувствую, что оно не должно требоваться или что с моей неопытностью я могу что-то упустить.
По сути, это сводится к следующему:
/* In the reducer: */
const initialState = {
someStateData: 'wow state',
error: undefined,
errorId: 0,
}
const reducer = (state = initialState, action) => {
switch (action.type) {
case SUCCESS:
return {
...state,
someStateData: action.data,
error: undefined,
}
case ERROR:
return {
...state,
error: action.error,
errorId: state.errorId + 1,
}
default:
return state
}
}
/* In the view component: */
class SomeComponent extends Component {
constructor(props) {
super(props)
this.state = {
lastErrorId: 0,
}
}
processHandlers() {
if (this.props.error &&
this.props.lastErrorId !== this.state.lastErrorId) {
this.props.onFailure?.(this.props.error)
this.setState({
...this.state,
lastErrorId: this.props.lastErrorId,
})
}
}
componentDidMount() {
this.processHandlers()
}
componentDidUpdate(prevProps, prevState) {
this.processHandlers()
}
}
const mapStateToProps = state => {
return {
error: state.error,
lastErrorId: state.errorId,
}
}
export default (connect(mapStateToProps)(SomeComponent))
Это прекрасно работает - есть ли другой, лучший способ? Более идиоматично с Redux?