【React】实现日志查看以下载.txt文件形式展示

本文介绍如何在React应用中,通过点击事件获取参数,调用接口获取日志内容,并以.txt文件形式供用户下载。当日志过大导致页面压力时,这种解决方案避免了实时展示带来的问题。文章详细阐述了解决思路,包括触发事件、接口调用和文件展示的步骤。
摘要由CSDN通过智能技术生成

一、前言

还记得11.18日才寤寐思服地写出来日志以弹窗形式实时展示

昨天下午让做成其他样式,主要是因为有些日志过大,对其产生的压力太大,老是挂掉

于是决定做成点击下载,将全量日志下载到本地

 

二、前提条件

后端以二进制流将日志内容传输过来

 

 

三、解决思路

其实改成这样实际上变得简单了不少,不用那么多弯弯绕

 

1、触发点击事件取得入参

在a标签触发点击事件后调用downloadFullLog,因为antd的table中每行数据都存储在record中,从中取出调用接口时需用的参数


 

代码:

<a onClick={()=>this.downloadFullLog(record)}>下载</a>

 

 

 

2、调用接口

将获取的入参传入,使用fetch()方法进行请求。

以.txt的形式存储到本地

 //下载日志
    downloadFullLog(recor
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值