Преобразование приложения React на основе обещаний в redux-saga: как настроить переменные компонента React? - PullRequest
0 голосов
/ 27 ноября 2018

Я новичок в программе redux-saga, и в качестве задачи я подумал, что постараюсь преобразовать большое существующее приложение React из Promises в redux-saga.Я добился определенного прогресса, но одна проблема, с которой я столкнулся, заключается в том, что когда я использовал Promises, я мог устанавливать локальные переменные компонента в зависимости от того, выполнено ли обещание или отклонено.Теперь кажется, что я просто «передаю» запрос на redux-saga и никогда не знаю (на сайте вызовов), выполнил ли он или нет, и теперь я не знаю (в рамках моего компонента), успешно ли он выполнен или нет.

Например, допустим, у меня есть вызов на основе обещаний, который выбирает игры моего пользователя

getCurrentGamesForUser = (nickname, token) => {
    return logic.getGamesForUser(nickname, token)
      .then(currentGames => {
        this.needToUpdateGamesFlagFromSocketIO = false
        this.setState({currentGames})
        sessionStorage.setItem('currentGames', JSON.stringify(currentGames))
      })
      .catch(({message}) => this.onError(message))
  }

Здесь я устанавливаю флаг this.needToUpdateGamesFlagFromSocketIO, а также sessionStorageпеременная - если мое обещание выполнится.

Теперь, насколько я понимаю, я бы преобразовал это в

 getCurrentGamesForUser = (nickname, token) => {
    this.props.dispatch(getCurrentGames(nickname,token))
  }

, и это прекрасно работает.Если есть ошибка, она будет отправлена ​​в хранилище из саги, и мой компонент отразит это.

Но что мне делать с локальными флагами и хранилищем сеанса?Нужно ли добавить их в магазин?Это кажется грязным путем, если у меня не было отдельного хранилища для каждого компонента, локального хранилища для каждого компонента, что также кажется грязным.Я видел обсуждение подобной темы здесь, https://github.com/redux-saga/redux-saga/issues/907,, но, похоже, нет ответа.Я уверен, что мне не хватает «избыточного способа» обработки всего этого, и поэтому приветствую любые указания.

1 Ответ

0 голосов
/ 27 ноября 2018

Redux-Saga предназначен для разгрузки всех триггеров, основанных на действиях, вне компонента в отдельную область действия саги.Так что, к сожалению, нет простого способа реализовать то, что вы просили.Хотя в упомянутом выше трекере Issue * 1002. * есть некоторые предлагаемые обходные пути.

Основной целью redux-saga была простота управления побочными эффектами путем разгрузки его в отдельный контекст выполнения.Одним из компромиссов является то, что общение может происходить только через component -> action -> saga -> store -> component.Следовательно, для вышеупомянутого требования, я считаю, что использование redux-saga было бы контрпродуктивным.

Тем не менее, вы всегда можете использовать redux-saga в сочетании с другими методами на основе обещаний / обратных вызовов, такими как redux-thunk.

Варианты использования, такие как выше, лучше подходят для реализаций на основе обратного вызова, в то время как полная изоляция побочных эффектов от избыточности будет хорошо обрабатываться с redux-saga.

...