单击 React 时发出警报警告

Posted 2023-02-22

【中文标题】单击 React 时发出警报警告

【英文标题】：Put Alert Warning when Clicking in React

【发布时间】：2022-01-14 03:26:00

【问题描述】：

我这里有一个图片上传器。我的问题是，如果您没有从autocomplete 中选择，我想让alert 在单击后首先出现。 目前alert在选择图片后出现。

代码沙盒CLICK HERE

  const handleDrop = (e) => 
    e.nativeEvent.preventDefault();

    if (!value) 
      setOpen(true);
     else 
      if (!e) return;
      const files = e.nativeEvent.dataTransfer.files;
      onUploadImage(files);
    
  ;

  const browseFiles = (e) => 
    if (!value) 
      setOpen(true);
     else 
      if (!e) return;
      const files = e.currentTarget.files;
      onUploadImage(files);
    
    e.target.value = null;
  ;

【参考方案1】：

您可以通过在包装文件输入的按钮上添加一个 onClick 来实现这一点：

     <Button
      size="medium"
      variant="outlined"
      component="label"
      color="primary"
      onClick=(e) => 
        if (!value) 
          setOpen(true);
          e.nativeEvent.preventDefault();
        
      
    >
      <input
        type="file"
        accept="image/*"
        multiple
        style= display: "none" 
        onChange=(e) => browseFiles(e)
      />
      Browse files
    </Button>