title: How to map through all children with Ant Design Tree Node
body: <p>I have a an array which looks similar to this:</p>
  
  <pre><code>const hierarchy = [
    {
      hierarchyId: 1,
      hierarchyName: 'John'
      children: [
        {
          hierarchyId: 2,
          hierarchyName: 'Mary',
          children: []
        },
        {
          hierarchyId: 3,
          hierarchyName: 'Jane',
          children: [
            {
              hierarchyId: 4,
              hierarchyName: 'Joan',
              children: []
            },
            {
              hierarchyId: 5,
              hierarchyName: 'Jim',
              children: [
                {
                  hierarchyId: 6,
                  hierarchyName: 'Mike',
                  children: []
                }
              ]
            }
          ]
        }
      ]
    }
  ]
  </code></pre>
  
  <p>And I want to represent this on an Ant Design Tree. But I want to be able to add buttons and possibly another column to a TreeNode in the Tree.</p>
  
  <pre><code>import React from 'react'
  import { Tree } from 'antd'
  const { TreeNode } = Tree
  
  const TreeComponent = ({ hierarchy }) =&gt; {
    return (
      &lt;Tree&gt;
        {hierarchy.map(res =&gt; {
          return (
            &lt;TreeNode
              key={res.hierarchyId}
              title={(
                &lt;div&gt;
                  &lt;span&gt;{res.hierarchyName}&lt;/span&gt;
                  &lt;span&gt;Another Column&lt;/span&gt;
                  &lt;button&gt;Click here&lt;/button&gt;
                &lt;/div&gt;
            )}&gt;
              {res.children.map(r =&gt; {
                &lt;TreeNode
                  key={res.hierarchyId}
                  title={(
                  &lt;div&gt;
                    &lt;span&gt;{res.hierarchyName}&lt;/span&gt;
                    &lt;span&gt;Another Column&lt;/span&gt;
                    &lt;button&gt;Click here&lt;/button&gt;
                 &lt;/div&gt;
                )} /&gt;
              })}
            &lt;/TreeNode&gt;
          )
        }}
      &lt;/Tree&gt;
    )
  }
  
  export default TreeComponent
  </code></pre>
  
  <p>Now obviously the above would only show 2 levels deep in the tree, I'm wondering if there were say 10 levels (or any amount really) how I would dynamically display each level in the tree without knowing how deep it goes and still be able to add a button and another column to the TreeNode?</p>
  
  <p>Any help is greatly appreciated, thanks!</p>