递归执行rxjs可观察函数

Question

我是RxJ的新手。我试图递归运行可观察函数，但没有运气。我要按此顺序打印。

  

表单文本框图标文本区域

这是我到目前为止尝试过的。任何帮助将不胜感激。

const args = {
  name: 'form',
  children: [{
    name: 'textbox',
    children: [{
      name: 'icon',
      children: []
    }]
  }, {
    name: 'textarea',
    children: []
  }]
};

import { of, from, Observable, concat } from 'rxjs'; 
import { map, concatAll, combineAll } from 'rxjs/operators';

const render = (component) => {
 return new Observable<any>(observer => {
   console.log(component.name);
   concat(...component.children.map(x => render(x)))
   .subscribe(() => observer.next());
 });
};

render(args).subscribe(() => console.log('done'));

Answer 1

这给出了正确的顺序。如果我错过了什么，请发表评论：

Matrix(df)

const { of, concat } = rxjs;

const args = {
  name: 'form',
  children: [
    {
      name: 'textbox',
      children: [
          {
            name: 'icon',
            children: []
          }
        ]
      },
    {
      name: 'textarea',
      children: []
    }
  ]
};

const render = (component) => concat(of(component), ...component.children.map(render));

render(args).subscribe(({name}) => console.log(name));