我正在使用材料表,我的要求是在选择它们后使行可编辑,我不是在寻找使所有行都可编辑的批量编辑,我只是希望选定的行可编辑但我面临的问题是材料table 允许一行或所有行都是可编辑的,我尝试了下面的代码,但它只使 changeRowEditing 方法被称为可编辑的最后一行,有没有办法使多行可编辑? >
<MaterialTable
columns={columnOptions}
data={props.values}
tableRef = {materialTableRef}
onSelectionChange={(rows) => {
console.log('---rows---', rows);
alert('You selected ' + rows.length + ' rows')}}
actions={[
{
tooltip: 'Edit selected rows',
icon: 'edit',
onClick: (evt, data:any) => {
const materialTable:any = materialTableRef.current;
// only data[1] is editable
materialTable.dataManager.changeRowEditing(data[0],"update");
materialTable.dataManager.changeRowEditing(data[1],"update");
materialTable.setState({
...materialTable.dataManager.getRenderState()
});
}
}
]}
options={{
actionsColumnIndex: -1,
showTitle: false,
paging: false,
search: false,
tableLayout: 'fixed',
maxBodyHeight: '50vh',
selection: true,
headerStyle: {
borderTopWidth: '1px',
borderBottomWidth: '1px',
borderTopStyle: 'solid',
borderBottomStyle: 'solid',
borderTopColor: colors.gray40,
borderBottomColor: colors.gray40,
fontWeight: 'bold',
color: colors.gray90,
position: 'sticky'
},
}}
components={{
Container: props => (
<div {... props}></div>
)
}}
/>