【问题标题】:How can I make the selected file type acceptable only as docx, using FilePond?如何使用 FilePond 使所选文件类型仅作为 docx 可接受?
【发布时间】:2020-08-19 01:45:45
【问题描述】:

我怎样才能使选择的文件类型只被接受为docx? 我希望所选文件仅具有 docx 扩展名。我应该应用什么样的过滤?我该怎么做?

React 代码示例

return (
    <>
        <Form className='orange-color ml-2'>
            <FilePond
                ref={ref => (ref)}
                allowFileEncode={true}
                allowMultiple={false}
                oninit={() =>
                    console.log("FilePond "+formKey.toString()+" has initialised")
                }

                onupdatefiles={(fileItems) => {
                    const file = fileItems.map(fileItem => fileItem.file)

                    if (file[0]) {
                        const reader = new FileReader();
                        reader.readAsDataURL(file[0]);

                        reader.onload = (event) => {
                            const convertedResult = event.target.result

                            if (convertedResult) {
                                const regex = '(.*)(base64,)(.*)';
                                const matches = convertedResult.match(regex);
                                const val = matches[3];

                                changeSelected(val)
                            }
                        };
                    }
                }

                }
            />
            <Form.Check>
                <Form.Check.Input required
                                  checked={input.value !== null}
                                  style={{display:'none' }}
                />
                <Form.Control.Feedback type="invalid" >Required</Form.Control.Feedback>
            </Form.Check>
        </Form>
    </>
)

【问题讨论】:

    标签: javascript node.js reactjs filepond


    【解决方案1】:

    文件类型验证插件处理阻止类型错误的文件。当基于输入类型文件创建 FilePond 实例时,该插件会自动解释 accept 属性值。

    https://github.com/pqina/filepond-plugin-file-validate-type

    【讨论】:

    【解决方案2】:

    【讨论】:

    • 它被用作'acceptedFileTypes = {' docx'}'吗?我看不到示例。
    【解决方案3】:
    acceptedFileTypes={'application/vnd.openxmlformats-officedocument.wordprocessingml.document'} 
    

    代码示例

    <Form className='orange-color ml-2'>
                        <FilePond
                            ref={ref => (ref)}
                            allowFileEncode={true}
                            allowMultiple={false}
                            acceptedFileTypes={'application/vnd.openxmlformats-officedocument.wordprocessingml.document'}
    
    ......
    

    【讨论】:

      猜你喜欢
      • 2020-09-27
      • 1970-01-01
      • 2019-12-15
      • 1970-01-01
      • 2019-02-02
      • 2018-01-29
      • 2010-11-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多