迁移服务端代码至React/Redux客户端：将Saga select封装为Promise模拟DB查询

兄弟，你这写法踩了个典型的坑——Promise的executor参数必须是普通同步函数，不能是生成器函数，所以new Promise(function* (res, rej) {...})这种写法完全不符合规范，自然跑不起来。下面给你两种靠谱的方案，根据你的使用场景选：

方案1：在Redux Saga里直接封装（最推荐，毕竟你已经在用yield了） #

如果你是在Redux Saga的生成器函数里想模拟“类似数据库查询的异步逻辑”，其实根本不需要手动套Promise，Saga本身就支持用yield处理这类逻辑，还能把获取state的逻辑封装成可复用的小Saga：

// 封装一个获取用户邮箱的Saga，模拟数据库查询逻辑
function* fetchUserEmail() {
  let email = yield select(state => state.user.app.email);
  
  // 可选：如果当前state里没有邮箱，等待state更新后再获取
  if (!email) {
    // 等待邮箱更新的action触发
    yield take('USER_EMAIL_UPDATED');
    email = yield select(state => state.user.app.email);
  }
  
  return email;
}

// 在其他Saga里用它，就像调用异步函数一样用yield
function* someBusinessFlow() {
  try {
    const userEmail = yield fetchUserEmail();
    console.log('拿到邮箱啦:', userEmail);
    // 这里写后续业务逻辑
  } catch (err) {
    console.error('获取邮箱失败:', err);
  }
}

要是你非要把它转成Promise（比如要和非Saga的异步代码兼容），可以用runSaga手动执行Saga并包装成Promise：

import { runSaga, take, delay, race } from 'redux-saga/effects';
import store from './你的ReduxStore路径';

function getUserEmailAsPromise() {
  return new Promise((resolve, reject) => {
    runSaga(
      { dispatch: store.dispatch, getState: store.getState },
      function* () {
        let email = yield select(state => state.user.app.email);
        
        if (email) {
          resolve(email);
          return;
        }
        
        // 等待邮箱更新，同时加个超时保护
        const { timeout, action } = yield race({
          action: take('USER_EMAIL_UPDATED'),
          timeout: delay(5000) // 5秒超时
        });
        
        if (timeout) {
          reject(new Error('获取邮箱超时啦'));
        } else {
          resolve(yield select(state => state.user.app.email));
        }
      }
    ).done.catch(reject);
  });
}

// 调用方式和普通Promise一样
getUserEmailAsPromise()
  .then(email => console.log('邮箱:', email))
  .catch(err => console.error(err));

方案2：不依赖Saga，直接监听Store变化 #

如果你不在Saga环境里，只是想从Redux Store拿某个值，等值存在时resolve Promise，可以用Store的subscribe方法监听state变化：

import store from './你的ReduxStore路径';

function getUserEmailAsPromise() {
  return new Promise((resolve, reject) => {
    // 先检查当前state里有没有值
    const currentEmail = store.getState().user.app.email;
    if (currentEmail) {
      resolve(currentEmail);
      return;
    }

    // 没拿到的话，监听state变化，直到拿到值
    const unsubscribe = store.subscribe(() => {
      const newEmail = store.getState().user.app.email;
      if (newEmail) {
        resolve(newEmail);
        unsubscribe(); // 拿到值就取消监听，避免内存泄漏
      }
    });

    // 加个超时，防止一直等下去
    setTimeout(() => {
      unsubscribe();
      reject(new Error('获取邮箱超时'));
    }, 5000);
  });
}

// 调用方式
getUserEmailAsPromise()
  .then(email => console.log('成功获取邮箱:', email))
  .catch(err => console.error(err));

划重点 #

• 别再把生成器函数传给Promise构造函数了，这是语法错误！Promise只认普通同步函数当executor。
• 要是在Saga生态里，优先用Saga自带的API（yield select、take、race这些），比手动套Promise简洁多了，也更符合Saga的设计思路。
• 只有需要和非Saga代码交互时，再考虑用runSaga或者Store的subscribe来封装Promise。

内容的提问来源于stack exchange，提问作者Franck