启用 addEventListener 回调来执行 put

Question

我需要做一个全球性的 addEventListener 之类的事情。我正在使用本机反应，需要监听深度 link 重定向事件。我想不出 redux-saga 的方法来做到这一点。我需要从 addEventListener 中的回调启用 put。

我目前正在执行导入 store 然后执行 store.dispatch(...) 的糟糕操作，如下所示：

import store from './flow-control'

Linking.addEventListener('url', ({ url }) => store.dispatch(_redir(url)));

是否有 redux-saga 方法可以做到这一点？

我本来希望把它写成一个传奇：

function* reduxSaga() {

    const url = yield Linking.addEventListener('url', ({ url }) => ???);

}

或者至少用这样的 put 替换 store.dispatch：

import { put } from 'redux-saga/effects'

Linking.addEventListener('url', ({ url }) => put(_redir(url)));

使用 redux-saga 执行此操作的正确方法是什么？

Answer 1

一种可能的解决方案是使用频道。这是一个适用于您的情况的示例：

import { channel } from 'redux-saga'
import { put, take, race } from 'redux-saga/effects'

const redirectChannel = channel()

export function* startRedirectChannel(id) {
  Linking.addEventListener('url', ({ url }) => redirectChannel.put({
    type: REDIRECT,
    url,
  }))
}

export function* watchRedirectChannel() {
  while (true) {
    const action = yield take(redirectChannel)
    yield put(action)
  }
}

这里的想法是，我们将为从 Linking.addEventListener.

发出的每个 url 事件在频道上推送一个重定向操作

我们还必须启动另一个 saga 函数，它会在 while 循环 (watchRedirectChannel) 中监听每个推送的操作。每次从通道中采取一个动作，我们使用正常的 yield put 来告诉 redux-saga 应该调度这个动作。

这里是一个使用 eventChannel API:

的例子

import { eventChannel } from 'redux-saga'
import { put, take } from 'redux-saga/effects'

export function* watchRedirect() {
  const redirectChannel = eventChannel(emitter => {
    Linking.addEventListener('url', emitter)

    // The subscriber must return an unsubscribe function
    return () => {
      Linking.removeEventListener('url', emitter)
    }
  })

  while (true) {
    const { redirectEvent, cancelEvent } = race({
      redirectEvent: take(redirectChannel),
      cancelEvent: take(ACTION_Y),
    })

    if (redirectEvent) {
      yield put({
        type: REDIRECT,
        url,
      })
    } else {
      redirectChannel.close()
      return
    }
  }
}

启用 addEventListener 回调来执行 put

Enable addEventListener callback to do put's

redux-saga