React Js는 목록 안에있는 목록 항목 요소를 렌더링합니다.

Question

안녕하세요 <li> 요소를 내 <ul> 목록에 매핑하려고합니다. 목록 항목이있는 경우

은 분명히 ul에 관계없이 보여줍니다

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

, 어떻게 목록 만 표시 할 수 있습니다 : 내 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); 

    }); 
}, 

나는 방법을 호출하는거야? 실제로 ul를 만들기 전에

감사

Answer 1

당신은 목록 항목의 크기를 확인할 수 있습니다.

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> 
);