如何在需要时停止反应物料台装载机

如何解决如何在需要时停止反应物料台装载机

我想在显示自定义错误消息时停止材料表加载器。这是我的材料表组件。而且我还需要知道如何在条件为假时创建自定义错误消息，就像 toaster 一样。这是我的尝试。请让我知道是否有办法做到这一点。因为我完全是材料表的初学者。

const tableIcons = {
    Add: forwardRef((props,ref) => <AddBox {...props} ref={ref} />),Check: forwardRef((props,ref) => <Check {...props} ref={ref} />),Clear: forwardRef((props,ref) => <Clear {...props} ref={ref} />),Delete: forwardRef((props,ref) => <DeleteOutline {...props} ref={ref} />),DetailPanel: forwardRef((props,ref) => <ChevronRight {...props} ref={ref} />),Edit: forwardRef((props,ref) => <Edit {...props} ref={ref} />),Export: forwardRef((props,ref) => <SaveAlt {...props} ref={ref} />),Filter: forwardRef((props,ref) => <FilterList {...props} ref={ref} />),FirstPage: forwardRef((props,ref) => <FirstPage {...props} ref={ref} />),LastPage: forwardRef((props,ref) => <LastPage {...props} ref={ref} />),NextPage: forwardRef((props,PrevIoUsPage: forwardRef((props,ref) => <ChevronLeft {...props} ref={ref} />),ResetSearch: forwardRef((props,Search: forwardRef((props,ref) => <Search {...props} ref={ref} />),SortArrow: forwardRef((props,ref) => <ArrowDownward {...props} ref={ref} />),ThirdStateCheck: forwardRef((props,ref) => <Remove {...props} ref={ref} />),ViewColumn: forwardRef((props,ref) => <ViewColumn {...props} ref={ref} />)
  };

const Table = ({columns,data,setData,required}) => {
    const [isLoading,setIsLoading] = useState(false);
    const [tableError,setTablesError] = useState({});

    useEffect(() => {
        //showing error message
      },[tableError]
    );

    return (
        <MaterialTable
        columns={columns}
        data={data}
        icons={tableIcons}
        options={{
          showTitle:false,search:false,paging:false,actionsColumnIndex:4,addRowPosition:'first',}}
        editable={{
          onRowAdd: newData => 
            new Promise((resolve,reject) => {
              let error = [];
              if(required.length > 0){
                var result = Object.keys(newData).map((key) => [key,newData[key]]);
                required.forEach(function(value){
                if(!result.some(row => row.includes(value))){
                    error.push(value)
                  };
                })
              }
              if(error.length > 0){
                setTablesError({error:'1',columns:error,msg:'validation'});
              }else{
                setTablesError({error:'0',columns:'',msg:''});
                setTimeout(() => {
                  setData([...data,newData]);
                  resolve();
                },1000)
              }
            }),onRowUpdate: (newData,oldData) =>
            new Promise((resolve,reject) => {
              setTimeout(() => {
                const dataUpdate = [...data];
                const index = oldData.tableData.id;
                dataUpdate[index] = newData;
                setData([...dataUpdate]);
                resolve();
              },1000)
            }),onRowDelete: oldData =>
            new Promise((resolve,reject) => {
              setTimeout(() => {
                const dataDelete = [...data];
                const index = oldData.tableData.id;
                dataDelete.splice(index,1);
                setData([...dataDelete]);
                resolve()
              },}}
      />
    )
  }

export default Table;

提前谢谢！

解决方法

这是promise调用，如果你想停止加载器调用resolve()函数。 它将解析 promise 调用并且加载程序将停止。