Возвращает [Объект объекта] вместо строки Dom в Reactjs

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]. Пожалуйста, помогите в решении этого.

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