React JS : 내부 HTML 추출

Question

두 개의 버튼을 span 태그로 감싸는 함수가 있습니다. span에서 buttons의 압축을 풀므로 부트 스트랩 스타일을 이용할 수 있습니다. 버튼은 버튼 그룹 스타일을하지 않아도 스팬이 너무 렌더링, 지금

render: function() 
{ 
    console.log(this.changesButtons()); 
    return (
     <div className="input-group"> 
      <span className="input-group-addon"> 
       <input 
        type="checkbox" 
        name="task-done" 
        id="task-done" 
        checked={this.state.taskDone} 
        onChange={this.handleDoneChanged} 
        /> 
      </span> 
      <input type="text" 
        className="form-control" 
        name="item-name" 
        id="item-name" 
        value={this.state.itemName} 
        onChange={this.handleTextChange}/> 
      <span className="input-group-btn"> 
       {this.changesButtons()} 
       <button className="btn btn-warning" 
         type="button" 
         name="delete-item" 
         id="delete-item" 
         onClick={this.handleDeleteClicked}> 
        <i className="fa fa-trash"></i> 
       </button> 
      </span> 
     </div> 
    ); 
} 

: 여기

은 버튼 기능입니다 :

changesButtons: function() 
{ 
    if(! this.state.textChanged) 
    { 
     return null; 
    } 
    else 
    { 
     return (
      <span> 
       <button className="btn btn-primary">Save</button> 
       <button className="btn btn-default">Undo</button> 
      </span> 
     ); 
    } 
}, 

여기에서 렌더링 기능입니다 그들에게 적용됩니다.

Answer 1

changesButtons() 함수를 만들지 마십시오. {changesButtons()}을 다음으로 대체하십시오.

{this.state.textChanged? 
     <span> 
      <button className="btn btn-primary">Save</button> 
      <button className="btn btn-default">Undo</button> 
     </span> 
:null}