0
点赞
收藏
分享

微信扫一扫

在vue3+ts项目里使用query和params传参

阿尚青子自由写作人 2023-08-22 阅读 45
前端

以下以下载图标svg文件为例,实现点击按钮下载文件,其中icon结构如下:

const DownloadSvg = (props) => {
    function download(downfile) {
        const tmpLink = document.createElement("a");
        const objectUrl = URL.createObjectURL(downfile);
        tmpLink.href = objectUrl;
        tmpLink.download = downfile.name;
        document.body.appendChild(tmpLink);
        tmpLink.click();
        document.body.removeChild(tmpLink);
        URL.revokeObjectURL(objectUrl);
    }
    return <div>
        <Button className='center-field' onClick={() => {
            const { icon } = props
            console.log(icon);
            // window.open打开新页签进行文件预览 可手动下载
            // window.open(icon.url)
            const file = new File([icon.icon_svg], `${icon.font_class}.svg`, {
                type: "image/svg",
            });
            download(file)
        }} >
            点击下载图标svg</Button>
    </div>
}
举报

相关推荐

0 条评论