react-bootstrap Form.File 指定多种允许的文件格式

Question

我想限制用户只能上传特定格式的图片。为此，我想在 Form.File 的 accept 属性中传递多种文件类型。我只能找到一种文件类型的示例。以下是我目前的代码：

<InputGroup >
    <Form.Group>
        <Form.File 
         onChange={(e) => setGamePhoto(e.target.files[0])}
         label="Upload The End-Game Photo"
         accept=".png"
        />
   </Form.Group>
</InputGroup>

我想传递多种文件类型，例如 png、jpg、jpeg、web 等

Answer 1

您可以以逗号 , 分隔列表的形式插入。试试这个：

<InputGroup >
    <Form.Group>
        <Form.File 
         onChange={(e) => setGamePhoto(e.target.files[0])}
         label="Upload The End-Game Photo"
         accept=".png,.jpg,.jpeg,.webp"
        />
   </Form.Group>
</InputGroup>

react-bootstrap Form.File 指定多种允许的文件格式

react-bootstrap Form.File specify multiple allowed files formats

html

input

react-bootstrap