Зависимый API ReactJS

Я новичок в ReactJS, поэтому у меня есть вопрос.

У меня есть API, который возвращает человека и количество его детей. Теперь у меня есть другой API, называемый сведениями о лицах, и я называю его так:

loadChildren(event) {
    const Id = event.target.id

    fetch('pathtoapi'+Id)
      .then(response => {
        if (!response.ok) {
          throw Error("Network request failed")
        }

        return response
      })
      .then(d => d.json())
      .then(d => {
        this.setState({
          children: d,
          open: true
        })
      }, () => {
        this.setState({
          loadFailed: true
        })
      })
  }

Я получаю необходимый идентификатор, имея это:

<div id = {person.Id} onClick = {this.loadChildren.bind(this) } >

Но я не могу получить список детей для каждого человека для отображения. Я перепробовал почти все, что мог придумать. Например:

 <div id = "demo" className = {"collapse" + (this.state.open ? ' in' : '')}>
                    <div>
                      this.state.children.map((children) => {
        return(
          <div className = "table-body">
            <div className = "table-row" key = {children}>
              <div className = "table-body-cell">
                {children.Name}
              </div>
              <div className = "table-body-cell">
                {children.YearOfBirth}
              </div>
              <div className = "table-body-cell">
                {children.Mother}
              </div>
            </div>
            </div>
        )
      })}
                    </div>
                  </div>

Но это не работает. Может ли кто-нибудь указать мне в правильном направлении, как решить эту проблему?

Я добавил ссылку на jsonblob для людей API и один для perondetails API

https://jsonblob.com/99f030d1-3838-11e9-8243-7f6a93786593

https://jsonblob.com/ccf6055e-3838-11e9-8243-f3a84e9c6252

Любая помощь высоко ценится