在 RxJS 中是否有更简洁（更动态）的方式来编写此映射函数？

Question

我需要在用户上传图片后推送一条新路由。新路由根据用户当前所在的特定模块而有所不同。目前，actionRouteEpic 过滤新路由，然后在每个 if 语句中调用 PUSH_ROUTE，但是有没有办法更新 route 变量，然后在开关映射的末尾调用一次 PUSH_ROUTE?

第一个代码示例是可以工作但看起来很笨重的版本。第二个例子是最近一次失败的清洁版本尝试。

目前有效：

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {
        if (action.module === 'module_one') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-one'
          });
        }
        if (action.module === 'module_two') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-two'
          });
        }
        if (action.module === 'module_three') {
          return of({
            type: 'PUSH_ROUTE',
            route: '/route-three'
          });
        }
        return empty();
      }
  );

const pushRouteEpic = action$ =>
  action$.pipe(
    ofType('PUSH_ROUTE'),
    map(action => push(`${action.route}`))
  );

尝试更清洁的版本：

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {
        let route = ''
        if (action.module === 'module_one') {
          route = '/route-one';
        }
        if (action.module === 'module_two') {
          route = '/route-two';
        }
        if (action.module === 'module_three') {
          route = '/route-three';
        }
        return of({
            type: 'PUSH_ROUTE',
            route: route
          });
      }
  );

const pushRouteEpic = action$ =>
  action$.pipe(
    ofType('PUSH_ROUTE'),
    map(action => push(`${action.route}`))
  );

谢谢，感激不尽。

Answer 1

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => of({
      type: 'PUSH_ROUTE',
      route: action.module === 'module_one' ? '/route-one' : 
             action.module === 'module_two' ? '/route-two' :
             '/route-three'
    })
  );

Answer 2

使用 js 对象作为哈希映射并定义一个 "router" 将每个模块映射到相关的入口路径

const actionRouteEpic = action$ =>
 const router = {
    module_one: '/route-one',
    module_two: '/route-two'
 } 
 action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(action => {     
        return of({
            type: 'PUSH_ROUTE',
            route: router[action.module]
          });
      }
  );

Answer 3

您的代码没有任何问题，但您可以 "cleaner" 通过使用作用于地图的函数来实现它：

const selectRouteFromActionModule = action =>
  of(
    {
      module_one: '/route-one',
      module_two: '/route-two',
      module_three: '/route-three',
    }[action.module],
  );

const actionRouteEpic = action$ =>
  action$.pipe(
    ofType('DISPATCH_ACTION_ROUTE'),
    switchMap(selectRouteFromActionModule),
  );

在 RxJS 中是否有更简洁（更动态）的方式来编写此映射函数？

Is there a cleaner (more dynamic) way of writing this map function in RxJS?

javascript

rxjs

redux-observable