我有2个表格,我可以在其中添加和删除元素..元素有2个日期和1个数字字段..所以你可以给出一个简单的方法,使它们可以内联编辑,但它们不仅是文本或当我点击日期它需要我显示自定义日期选择器...但我需要编辑只有一个日期或数字我不想编辑所有行当我双击它..只是那个字段什么我点击了。谢谢:)顺便说一句,这是所有反应指令。 我需要类似的东西
render: function () {
var itemMap = this.state.items.map(function (item, i) {
return (
<tr key={i}>
<td><input type="checkbox" checked={item.selected} onClick={this.handleChange.bind(this,i)} /></td>
This i want to change with inline edit -> <td ><FormattedDate value={item.startDate}/></td>
This i want to change with inline edit -> <td><FormattedDate value={item.endDate}/></td>
This i want to change with inline edit -> <td>{item.workInHours}</td>
<td><label type="button" onClick={this.handleShowModal.bind(this,i)}><img height="30px" src="moliv.jpg"/></label>
</td>
</tr>
);
}.bind(this));
return (
<div>
<button className="btn btn-primary center-block" onClick={this.addElem}>Add</button>
{this.state.list.theList.length > 0 ? <button className="btn btn-primary" onClick={this.putResult}>Put result</button> :null}
<table className="table scroll2">
<thead>
<tr className="danger">
<th><input type="checkbox" checked={this.state.allChecked} onClick={this.toggleAll}/></th>
<th>Start Date</th>
<th>End Date</th>
<th>Hours</th>
<th></th>
</tr>
</thead>
<tbody>
{itemMap}
</tbody>
</table>
{this.state.items.length > 0 ? <button type="button" className="btn btn-danger" onClick={this.deleteItems}>Remove</button> : null}
<Modal parentState={this.state} modalPropsId={this.props.theProps.id} handleHideModal={this.handleHideModal}/>
</div>
);