gpt4 book ai didi

javascript - 在react-dropzone-uploader的onSubmit方法中访问props

转载 作者:行者123 更新时间:2023-11-28 03:08:34 25 4
gpt4 key购买 nike

我正在使用react-dropzone-uploader上传文件。一切正常;除了我希望在单击提交按钮后更新父组件。我该怎么办?

这是我使用的代码部分:


export default () => {

const handleSubmit = (files, allFiles) => {
console.log('uploads files:', files, this)
// There is no access to props here.
}

return (
<Dropzone
getUploadParams={getUploadParams}
onChangeStatus={handleChangeStatus}
onSubmit={handleSubmit}
accept="image/*,.pdf,.doc,.docx"
/>
)
}

最佳答案

由于它是一个功能组件,因此您不需要 this 并且可以从中获取 props

export default (props) => {

const handleSubmit = (files, allFiles) => {
console.log('uploads files:', files)
// Get set state function from props
props.setFiles(files)
}

return (
<Dropzone
getUploadParams={getUploadParams}
onChangeStatus={handleChangeStatus}
onSubmit={handleSubmit}
accept="image/*,.pdf,.doc,.docx"
/>
)
}

在父级中,您可以将此组件称为

...
const [files, setFiles] = useState(null)
...
return (
<div>
<div>Drop files</div>
<CustomDropzone setFiles={setFiles} />
</div>
)

关于javascript - 在react-dropzone-uploader的onSubmit方法中访问props,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60371268/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com