6

Adazzle 数据网格中的网格如何嵌入到基于Redux-Form的反应组件中？

我有一个使用单元格编辑的数据网格。Adazzle 网格使用行的状态变量和一些访问器方法来呈现数据。它有一个用于更新行的处理程序。这是我采用的一种方法，用于将表单数据与网格中的更改同步。问题是在更改表单值后原始标志未设置为 false handleGridRowsUpdated。

handleGridRowsUpdated({fromRow, toRow, updated}) {
let rows = this
  .state
  .rows
  .slice();

for (let i = fromRow; i <= toRow; i++) {

  //update the data-grid
  let rowToUpdate = rows[i];
  let updatedRow = {
    ...rowToUpdate,
    ...updated
  };
  rows[i] = updatedRow;

  //update the underlying redux-form values
  let entity = this.props.input.value[i]
  this.props.input.value[i] = {...entity, ...updated}
}

this.setState({rows});
}

此外，这是我从 Redux-form 填充行的方式。基于 Redux-forms 的组件使用另一个包装 react-data-grid 的组件。

constructor(props) {
 super(props)

 this.state = {
   rows: [],
   filters: {},
   sortColumn: null,
   sortDirection: null,
   selectedIndexes: []
 }

 const {input: {
    value
  }} = props;

 this.state.rows = value;
}

我也在考虑使用隐藏的表单控件，这可能只会让他更新到网格，以便只有来自网格的更改值被传递回服务器。

4

0 回答 0