リスト内のJsレンダーリスト項目要素を反応させる

Question

こんにちは、<li>要素を<ul>リストにマップしようとしています。私は、メソッドを呼び出すよ、私のreturn文で

makelist: function() { 
    var self = this; 
    return _.map(this.state.files, function (val) { 
     return React.createElement('li', { key: val.id }, React.createElement('p', { className: bgSuccess }, val.name, ' ', delButton), progressBar, errorDiv); 

    }); 
}, 

：

return (
     <div className='file-input-controls'> 
      <ul className='file-input-list'> 
       {this.list()} 
      </ul> 
      <TableActionButtons {...actionButtonsOptions} /> 
     </div> 
    ); 

明らかulは、リストの項目がある場合、私は唯一のリストを表示することができますに関係なく、どのように示して？

おかげ

Answer 1

あなたが実際にulを作成する前に、リスト項目のサイズを確認することができます。

var ul = null; 
var items = this.makelist(); 
if (items.length > 0) { 
    ul = (
     <ul className='file-input-list'> 
      {items} 
     </ul> 
    ); 
} 

return (
    <div className='file-input-controls'> 
     {ul} 
     <TableActionButtons {...actionButtonsOptions} /> 
    </div> 
);