React中material tabel列的重复数据验证

Question

下面的代码是我想要在一行的material Tabel字段上应用重复验证的代码，验证将应用于标志字段。

字段标志的物料标签验证，

下面是由flag字段组成的类，需要对其进行验证，它应该始终是唯一的，每一行都应该有一个唯一的flag元素

  const columns = [
    {
      title: "Type",
      field: 'flag'.trim(),
      editable: 'onAdd',
      validate: rowData => {
        if(rowData.flag===undefined || /^ *$/.test(rowData.flag)){
          return 'Required'
        }
        return true
      }},    {
    }
  ];

  const updateTableData = (newData, oldData) => {
    newData.shopId = selectedShop.value
    setActionPerformed(true)
    // eslint-disable-next-line no-unused-vars
    return new Promise((resolve, reject) => {
      setTimeout(() => {
        const dataUpdate = [...data];
        const index = oldData.tableData.id;
        dataUpdate[index] = newData;
        setData([...dataUpdate]);
        resolve();
      }, 300)
    })
  }

  const addRowToTable = (newData) => {
    setActionPerformed(true)
    // eslint-disable-next-line no-unused-vars
    return new Promise((resolve, reject) => {
      setTimeout(() => {
         setData([...data, newData]);
        resolve();
      }, 300);
    })
  }
  const saveConfig = async () => {
    var currentShop = selectedShop.value
    var updatedData
    if (currentShop !== 'All') {
      updatedData = data.filter( item => item.shopId !== 'All')
    } else {
      updatedData = data
    }
    if (updatedData.length > 0 && actionPerformed) {
      const response = await updateShopConfiguration(props.context, currentShop, updatedData);
      console.log(`response ===`, response)
      if (response === 'error') {
        getConfiguration(selectedShop);
      }
    }
    setActionPerformed(false)
  }
  console.log('isSaveEnabled :>> ', isSaveEnabled, actionPerformed);
  return (
    <div className="page page-dashboard">
      <header>
        <h1>Feature Flags</h1>
      </header>
      <div className="content no-padding">
        <div className="advanced-filter">
          <div className="filters active">
            <div className="filter">
              <label htmlFor={'shop'}>Select Shop</label>
              <Select
                id="shop"
                defaultValue={{ label: "All", value: "All" }}
                placeholder={"Select Shop"}
                options={allShops}
                value={selectedShop}
                onChange={handleChange}
                isClearable
              />
            </div>
          </div>
        </div>
        {data.length > 0 && (
          <div className="list overflow-list">
            <MaterialTable
              icons={tableIcons}
              options={{
                paging: false,
                addRowPosition: 'first'
              }}
              columns={columns}
              data={data}
              editable={{
                isDeleteHidden: (row)=>row.shopId!=selectedShop.value,
                onRowUpdate: (newData, oldData) => updateTableData(newData, oldData),
                onRowAdd: (newData) =>addRowToTable(newData),
                onRowDelete: ( oldData ) => deleteRow(oldData)
              }}
              title={configLabel}
            />
          </div>
        )}

在上面的类中是将应用重复数据字段的验证的类，任何销售线索感谢

Answer 1

摆脱上当受骗

​

const data = [1,2,3,4,5,1,1,2,3,9,10,20,5]

const withoutDupes = [...new Set(data)]
console.log(withoutDupes)

​

检查是否存在重复项

​

const data = [1,2,3,4,5,1,1,2,3,9,10,20,5]

const withoutDupes = [...new Set(data)]
const dupesExist = withoutDupes.length !== data.length

console.log("dupes exist: ", dupesExist)

​