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

标签 javascript html css reactjs redux

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

我调试了代码,获取了 b64Data 变量中的数据。 url 在 blobUrl 中添加,但我需要在与此 fiddle 类似的同一页面中下载 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>

最佳答案

这样试试

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);

关于javascript - react 在同一页面下载文档,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56565350/

相关文章:

html - Google Chrome - 如何使视频元素完全适合布局?

jquery - 页脚淡入然后淡出

html - 在 div 内居中的一组图形

javascript - 如果没有内容,使 <div> 不可见

javascript - 无法在具有年度系列的 highcharts 上设置最小值/最大值

javascript - 如何在两行后添加省略号?

javascript - 使用 1 个选项取消选择多项选择中的所有选项

jquery - 获取字符串的值;在内容中找到这个字符串;感谢 jQuery 将新样式应用于此字符串

javascript - 如果用户的浏览器早于 : IE 10, Firefox 39、Chrome 39、Opera 8,则显示一条消息

javascript - Typescript 和 Uglify 任务