reac+antd上传/下载

// index.tsx
const importProps = useMemo<UploadProps>(() => ({
    accept: '.json',
    showUploadList: false,
    beforeUpload: (file) => {
      const reader = new FileReader();
      reader.readAsText(file, 'utf-8');
      reader.onload = () => {
        const jsonData = JSON.parse(reader.result as string);
        console.log('file信息:', jsonData);
        // 做一些自定义操作
        ...
      }
      return false
    }
  }), [])
<Upload {...importProps}>
  <Button type="link">导入</Button>
</Upload>

// 下载
const handleDownload = (data: any) => {
    // data 为 object
    const value = JSON.stringify(data, null, "\t");
    const blob = new Blob([value], { type: "application/json" });
    const url = URL.createObjectURL(blob);
    const link = document.createElement("a");
    link.href = url;
    link.download = "down_name.json";
    link.click();
    URL.revokeObjectURL(url);
};
<Button type="link" onClick={handleDownload}>下载</Button>
最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容