元素推无结束标记JSX

问题描述：

我想执行下面的递归函数，问题是ul因为当函数被称为我推标记，并在forEach结束时，我关闭它。如果我将outputArray.push(<ul>)更改为</ul>，那么它可以正常工作，但这不符合我的目的。元素推无结束标记JSX

任何方式吗？

注意：这是一个递归函数。

function flatten(data, outputArray) { 
 
     outputArray.push(<ul>) 
 
     data.forEach(function (asset){ 
 
      if(asset.children.length) { 
 
       outputArray.push(<li><button onClick={_ => this.appendAssets(asset.name)}>{asset.name}</button></li>); 
 
       flatten(asset.children, outputArray); 
 
      } 
 
      else{ 
 
       outputArray.push(<li><button onClick={_ => this.appendAssets(asset.name)}>{asset.name}</button></li>); 
 
      } 
 
     }); 
 
     outputArray.push(</ul>) 
 
    }

什么将它们放入一个数组的地步？你想达到什么目的？ –

只是要渲染成dom。只需要ul和li来保留结构。 –

为什么不使用纯JSX来渲染ul，并在它内部将数组映射到li元素中？ –

答

考虑以下结构

let enclosure = []; 
loop { 
    enclosure.push(jsx); 
} 
return (<ul>{enclosre}</ul>);

元素推无结束标记JSX

相关推荐