我正在使用带有选项的React MaterialTable
组件。选择:正确。当我选择一个或多个行时,将在顶部/右侧的“编辑”按钮上启用它。我如何编码此按钮?我应该使用女巫动作/选项吗?
产品编号:
<MaterialTable
icons={tableIcons}
title="Table"
columns={this.getColumns()}
data={this.props.data}
options={{
filtering: true,
selection: true
}}
editable={{
onRowUpdate: (newData, oldData) =>
new Promise((resolve, reject) => {
console.log('OnRowUpdate');
setTimeout(() => {
{
this.props.setdata(newData);
}
resolve();
}, 1000);
}),
}}
/>
您的解决方案在this link中的物料页面中>
这是页面编码的代码
<MaterialTable title="Editable Example" columns={state.columns} data={state.data} editable={{ onRowAdd: newData => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data.push(newData); setState({ ...state, data }); }, 600); }), onRowUpdate: (newData, oldData) => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data[data.indexOf(oldData)] = newData; setState({ ...state, data }); }, 600); }), onRowDelete: oldData => new Promise(resolve => { setTimeout(() => { resolve(); const data = [...state.data]; data.splice(data.indexOf(oldData), 1); setState({ ...state, data }); }, 600); }), }} />
我的代码笔中有一些东西,也许会帮到您my codepen