在cyclejs中，如何使用"if else“呈现组件

Question

function componentA(sources$) {
   return {
      dom$: ...,
      http$: ...
  }
}    

function componentB(sources$) {
   return {
      dom$: ...,
      http$: ...
  }
}

function main(sources$) {    
    sources$.props.pipe(
       switchMap(props=> {
           if (props.showA) {
              const sinksA$ = componentA(sources$);
           } else {
              const sinksB$ = componentB(sources$);
          }
      })
   )

  return {
           // how to make dom$ and htttp$ ?
  }
}

那么如何分别合并两个不同的流呢？

Answer 1

这可能会实现您正在尝试实现的目标：

function main(sources) {
  // Component A
  const aSinks$ = sources.props
    .filter(props => props.showA)
    .mapTo(componentA(sources));
  const aDom$ = aSinks$.map(sinks => sinks.dom)
  const aHttp$ = aSinks$.map(sinks => sinks.http)

  // Component B
  const bSinks$ = sources.props
    .filter(props => !props.showA)
    .mapTo(componentB(sources));
  const bDom$ = bSinks$.map(sinks => sinks.dom)
  const bHttp$ = bSinks$.map(sinks => sinks.http)

  return {
    dom$: xs.merge(aDom$, bDom$),
    http$: xs.merge(aHttp$, bHttp$),
  };
}

如果你需要比这个示例代码更多的解释，请让我知道。