在 cellEditable 材質表上，如何限制用戶輸入負數？

Question

我在我的項目中使用可編輯的材料表單元格。 我想限制用戶在該字段中輸入否定的 no。 另外，拋出錯誤驗證。 如何實現？

https://codesandbox.io/s/material-demo-forked-h1f8d?file=/demo.js:609-979

 <MaterialTable
      title="Cell Editable Preview"
      columns={columns}
      data={data}
      cellEditable={{
        onCellEditApproved: (newValue, oldValue, rowData, columnDef) => {
          return new Promise((resolve, reject) => {
            console.log("newValue: " + newValue);
            setTimeout(resolve, 1000);
          });
        }
      }}
    />

Answer 1

Material-table 支持通過列進行驗證。 您必須在列中添加驗證鍵，然后根據您的要求進行驗證。 例如：

columns={[
    {
          title: 'Name', field: 'name',  validate: rowData => rowData.name === '' ? 'Name cannot be empty' : ''
    },     
]}

如果名稱為空，上述代碼將出錯。 您可以對案例中所需的單元格執行相同的操作。