javascript - 在 Reactjs 中返回 [Object 对象] 而不是 Dom 字符串

Question

var content = "";
for(var i=0;i<menuData.length;i++){           

 content += <li className={"accordion-menu-item "+showComponent} onClick={this.handleClick} id={menuTag}> 
     <div className={"menuLabel "+labelClassName}>{componentLabel}{manageActionLabel}</div>
     {allowDropDownElement}
     {this.createInnerComponent(allowDropDownFlag,innerComponents,showComponent)}
  </li>
}
return  <ul className="accordion-menu-wrapper">{content}</ul>

以上代码全部放在Reactjs中。 上面的代码是一个函数内部的代码，它应该返回 DOM 字符串而不是返回 [object object][object object][object object][object object]。请帮忙解决这个问题。

Answer 1

不要将内容用作字符串，而是使用数组。

var content = [];
for(var i=0;i<menuData.length;i++){           

 content.push(<li className={"accordion-menu-item "+showComponent} onClick={this.handleClick} id={menuTag}> 
     <div className={"menuLabel "+labelClassName}>{componentLabel}{manageActionLabel}</div>
     {allowDropDownElement}
     {this.createInnerComponent(allowDropDownFlag,innerComponents,showComponent)}
  </li>);
}

return  <ul className="accordion-menu-wrapper">{content}</ul>

Demo