对React-Data-Grid中的某些列执行验证

import React, { useState } from 'react';
import ReactDataGrid from 'react-data-grid';

const columns = [
  { key: 'id', name: 'ID' },
  { key: 'name', name: 'Name', validator: validateName },
  { key: 'age', name: 'Age', validator: validateAge },
];

const initialRows = [
  { id: 1, name: 'John Doe', age: 25 },
  { id: 2, name: 'Jane Smith', age: 30 },
];

function validateName(value) {
  if (!value) {
    return { valid: false, message: 'Name is required' };
  }
  return { valid: true };
}

function validateAge(value) {
  if (value < 0 || value > 120) {
    return { valid: false, message: 'Age must be between 0 and 120' };
  }
  return { valid: true };
}

function App() {
  const [rows, setRows] = useState(initialRows);

  function handleGridRowsUpdated({ fromRow, toRow, updated }) {
    const updatedRows = rows.slice();
    for (let i = fromRow; i <= toRow; i++) {
      updatedRows[i] = { ...updatedRows[i], ...updated };
    }
    setRows(updatedRows);
  }

  return (
    <ReactDataGrid
      columns={columns}
      rows={rows}
      onGridRowsUpdated={handleGridRowsUpdated}
    />
  );
}

export default App;