javascript - react 在同一页面下载文档

Question

我正在尝试在同一页面上下载文件。但问题并没有发生。

我调试了代码，在 b64Data 变量中获取数据。url 正在添加 blobUrl，但我需要在与此小提琴类似的同一页面中下载http://jsfiddle.net/ovfiddle/7NqKb/

你能告诉我如何解决吗？

在下面提供我的代码片段：

fileContents = (data) => {
        console.log(data);
        console.log("data.content--->", data.data.content);
        var contentType = 'application/pdf';

        var b64Data = data.data.content;

        var blob = b64toBlob(b64Data, contentType);
        var blobUrl = URL.createObjectURL(blob);
        console.log("displayDocumentData blobUrl--->", blobUrl);
        //window.location = blobUrl;
        console.log(blobUrl);
        this.setState({ downloadUrl: blobUrl });


    }


    <Button
    onClick={e => {
        this.props.actions.downloadDocumentData(this.fileContents);
    }}
    variant="outlined"
    color="primary"
    size="small"
// className={classes.button}
>

    Download Document test
</Button>

标签： javascripthtmlcssreactjsredux

Answer 1

像这样试试

const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.setAttribute('visibility', 'hidden');
link.setAttribute('download', 'your file name');
document.body.appendChild(link);
link.click();
document.body.removeChild(link);