如何使选择的文件类型只接受docx，使用FilePond？

Question

我如何使选定的文件类型只能接受为 "docx"，使用FilePond？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>
    </>
)

Answer 1

文件类型验证插件可以处理屏蔽类型错误的文件。当基于输入类型文件创建FilePond实例时，该插件将自动解释accept属性值。

https:/github.compqinafilepond-plugin-file-validate-type。

Answer 2

Filepond有一个文件类型的插件。https:/pqina.nlfileponddocspatternspluginsfile-validate-type。

Answer 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'}

......