如何在reactjs中单击按钮取消下载文件？

Question

我要在单击“取消”按钮时取消下载文件。

我要做什么？

我通过向服务器发送请求来下载文件，该请求根据下载的文件大小显示进度条。现在，如果用户单击“取消”按钮，它将停止下载文件。我不确定如何取消请求。我设置了一个load_cancel状态，该状态在取消按钮上设置为true，在componentwillunmount方法上单击，load_cancel状态设置为false。

下面是代码

this.state {
    load_cancel: false,};

componentDidMount() {
    if(this.props.item) {
        this.load_item_data();
    }
}

on_load_cancel = () => {this.setState({load_cancel: true;});

load_item_data = () => {
    const props = this.props;
    this.file_download_status = {};
    if (this.on_item_changed) {
        this.on_item_changed();
    }
    const item_changed = new Promise((resolve) => { this.on_item_changed = 
    resolve; });
    const abort_loading = Promise.race([item_changed, this.unmount]);

    item.load(props.item.id, gl, this.update_download_progress, 
    abort_loading).then((result) => {
        this.files = result.files;
        this.setState({
            item_download_done: true,
        });
        client.add_item_view(props.item.id, abort_loading);
    });

    {props.item &&
                <ProgressBar
                    on_load_cancel={this.load_cancel}
                />}

下面是进度栏组件中的取消按钮，

<button onClick={props.on_load_cancel}>Cancel</button>

有人可以帮我吗？谢谢。