如何将其转换为功能组件

时间:2020-04-22 09:48:59

标签: reactjs react-component react-data-grid react-functional-component

我已经从react-data-grid中获得了它,我已经将其转换为功能组件,但是当我更改行的内容时,更改会生效

原始

  onGridRowsUpdated = ({ fromRow, toRow, updated }) => {
    this.setState(state => {
    const rows = state.rows.slice();
    for (let i = fromRow; i <= toRow; i++) {
      rows[i] = { ...rows[i], ...updated };
    }
    return { rows };
  });
};

我的代码

    const columns = [some data];
    let rowsIntial = [some data];
    const[rows,setRows]=useState(rowsinitial);

    const   onGridRowsUpdated = ({ fromRow, toRow, updated }) => {

        const rows = rows.slice();
       console.log(rows);
       for (let i = fromRow; i <= toRow; i++) {
          rows[i] = { ...rows[i], ...updated };
         }

      return rows;
   };

JSX:

                    <ReactDataGrid
                        columns={columns}
                        rows={rows}
                        onGridRowsUpdated={onGridRowsUpdated}
                        enableCellSelect={true}
                    />

如何更改onGridRowsUpdated才能正常工作?

1 个答案:

答案 0 :(得分:1)

const onGridRowsUpdated = ({ fromRow, toRow, updated }) => {
    setRows((state) => {
        const newRows = state.slice();
        console.log(newRows);
        for (let i = fromRow; i <= toRow; i++) {
            newRows[i] = { ...newRows[i], ...updated };
        }
        return newRows;
    }
};
相关问题