如何获取文件上传进度？

Question

我是AOR和redux-sagas的新手，我目前正致力于列表视图的拖放和上传功能。我希望用户能够从列表视图中拖放文件并查看当前上载进度和状态。

组件的原型如下所示：

// ...
<Dropzone onDrop={this.onDrop} onDragLeave={this.onDragLeave} onDragEnter={this.onDragEnter} ref={(node) => {this.dropzoneRef = node;}} disableClick disablePreview style={{}}>
    // Dropped files will appear here, with the upload progress
    <Card style={{marginBottom: "1em"}}>
        <CardTitle>Picture.jpg</CardTitle>
        <CardText>
             // The progress bar will show the upload progress
             <LinearProgress value={50} mode="determinate" />
        </CardText>
    </Card>
    <List {...props} actions={<FileActions onUploadClick={() => {this.dropzoneRef.open()}} />}>
        <Datagrid>
            <TextField source="name" />
            <DateField source="createdAt" />
            <EditButton />
        </Datagrid>
    </List>
</Dropzone>

onDrop回调会收到已删除的文件，以及需要处理上传的文件。这就是我对如何处理问题感到困惑的地方。

我understand I have to decorate my REST client in order to be able to upload my files。但是如何插入一些函数以便将每个文件的上传进度发送到我的组件？