0
をspan
という2つのタグで囲んで返す関数があります。 span
からbuttons
を抽出して、ブートストラップスタイルを利用できるようにします。ボタンはボタングループのスタイルを持っていないので、スパンがあまりにもレンダリングされ、今React JS:内部HTMLを抽出
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>
);
}
},
、ここでレンダリングする機能ですそれらに適用されます。
ありがとうございます!私が探していたもの。 – DevITper