我想执行下面的递归函数,问题是ul
因为当函数被调用时,我正在推送一个 ul
标记并位于 forEach
的末尾我正在关闭它。如果我改变 outputArray.push(<ul>)
随着结束</ul>
然后它工作正常,但这不符合我的目的。
有什么办法吗?
注意:这是一个递归函数。
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>)
}
最佳答案
你做的最好的事情是:
let arr1 = [];
let arr2 = [];
您可以循环并将尽可能多的 JSX li 插入 arr1:
arr1.push(<li>Some content</li>);
然后您可以将 arr1 的全部内容推送到 arr2,用 ul 标签包裹:
arr2.push(<ul>{arr1}</ul>);
然后简单地渲染并返回它:
render(){
return (
<div>{arr2}</div>
)
}
当您需要生成行数和列数可变的网格时,这种方法非常有效。
关于javascript - 没有关闭标签的元素推送 JSX,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42286244/