map兩次唄，

fil.map(f=>
    <div>
        {f.child.map(c=><div></div>)}
    </div>）

// 第一步：將一棵展開
function flatTree(tree, parentId) {
  return tree.reduce((list, { id, flag, name, value, child }) => {
    list.push({ id, flag, name, parentId, value });
    if (child) {
      return list.concat(flatTree(child, id));
    }
    return list;
  }, []);
}
// 第二步：渲染
flatTree(filtrateFields).map(({ id, flag, name, value }) => (
  <label key={id}>
    <input type="checkbox" checked={flag || false} onChange={({ target: { checked } }) => myOnChange(id, value, checked)} />
    {name}
  </label>
));

filtrateFields.map((item,i) =>{
     return(
     <div key={i}>
     {item.name}
     </div>
     )
     item.map((list,k) =>{
       return(
       <div key={k}>
       {list.name}
       </div>
       )
     })
})