使用ag-grid和react andtypescript,我有一个定义为可编辑的列,它使用GraphQL查询中的数据(保持状态)进行初始化。
编辑单元格时出现以下错误: TypeError:无法指定对象'#'
的只读属性'destination'它所涉及的代码是 ValueService ../ node_modules / AG-网格/ DIST / LIB / valueService / valueService.js.ValueService.setValue
有谁知道它试图存储更改的值的位置以及发生这种情况的原因?
代码片段:
componentWillMount() {
// we use state because the columns might change dynamically
this.setState( { columnDefs: this.createColumnDefs() });
}
createColumnDefs() {
return [
{ colId: 'b', headerName: 'ID', field: 'rowID', hide: true },
{ colId: 'c', headerName: 'Name No.', field: 'nameNo', hide: true },
{ colId: 'h', headerName: 'Destination', field: 'destination', editable: true},
{ colId: 'i', headerName: 'CopyTo', field: 'copyTo', editable: true },
{ colId: 'j', headerName: 'Subject', field: 'subject', editable: true },
{ colId: 'k', headerName: 'Body', field: 'body', editable: true }
];
}
componentWillReceiveProps(nextProps: SelectionQueryProps) {
........
// props come from an Apollo/GraphQL wrapper so setting it in state
this.setState( { data: nextProps.data } );
}
}
render() {
if (!this.state.data || this.state.data.loading || !this.state.data.statementCreation) {
return <div><Loader active={true} inline="centered" size="large" /></div>;
}
return (
<AgGridReact
animateRows={true}
enableColResize={true}
enableFilter={true}
enableSorting={true}
enableRangeSelection={true}
rowModelType="inMemory"
columnDefs={this.state.columnDefs}
singleClickEdit={true}
stopEditingWhenGridLosesFocus={true}
rowSelection={'multiple'}
onGridReady={this.onGridReady}
onRowSelected={this.onRowSelected}
suppressRowClickSelection={this.props.generate}
/>
);
}
private onGridReady = (params: GridReadyEvent) => {
this.gridApi = params.api;
if (this.state.data && !this.state.data.loading && this.state.data.statementCreation) {
params.api.setRowData(this.state.data.statementCreation);
params.columnApi.autoSizeAllColumns('autosizeColumns');
params.api.sizeColumnsToFit();
}
}