title: ant design table with dynamic children columns
body: <p>I'm using ant's table and trying to setup dynamic columns.</p>
  
  <p>What I need is a table that shows a list of users with their performance for each of the classes as in the example below.</p>
  
  <p><a href="https://i.stack.imgur.com/KxFrQ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/KxFrQ.png" alt="enter image description here"></a></p>
  
  <p>Details: I have a grouped column <code>Performance</code> that can have different sub-columns (current example shows columns <code>science</code> and <code>physics</code>). I'm calling renderContent() which sets up an object that has property <code>children</code>. I found this "solution" from ant's example <a href="https://ant.design/components/table/#components-table-demo-colspan-rowspan" rel="nofollow noreferrer">here</a>. The problem is that ant's example outputs children prop type string, while my function outputs prop type array. Which results in the error. </p>
  
  <p>Here is a link to sandbox:
  <a href="https://codesandbox.io/embed/ecstatic-cookies-4nvci?fontsize=14" rel="nofollow noreferrer">https://codesandbox.io/embed/ecstatic-cookies-4nvci?fontsize=14</a></p>
  
  <p><em>Note: if you uncomment children array in columns [line 46-59], you will see what my expected result should be.</em></p>