Question

你好，我正在学习React JS

而且，我正在研究从webapp下载json文件的方法

我试图找到解决方法，但是我不明白。

Converting Object into JSON and downloading as a .json file in React

How do I save a file getting downloaded from server using react?

这是我的问题。

我有类似的构造函数。

 constructor(props) {
    super(props);
    this.state = {

      Json_String: "{'None','none'}, 
      Project_NUM: "None"
    }

   }

我有一种方法可以从Mongo DB获取数据，并使用JSON.stringify将数据转换为字符串类型json。...

  JsonBuilder() {           
      let {proj} = this.props;

         axios.get(SCongig.proj_Url, { params: {
        GuestID: proj.GuestID,
        Company_ID: proj.Company_ID
        }}, null)
      .then((res)=> {
         this.setState({...this.state,Json_String:  JSON.stringify(res.data[0])});
         this.setState({...this.state,Project_NUM:  proj.Company_ID});

      })

    }

而且，我有javeacript部分..哪个按钮并通过点击事件下载json

  <a download={`TEST_ ${this.state.Project_NUM}.json`}  href={`data:application/json;charset=utf-8;base64,${this.state.Json_String.json}`}> 

   <Button
      shape="circle"
      icon="save"
      style={{border: 'none', background: 'none', width: 15, height: 15, marginLeft: 10}}
      onClick={this.JsonBuilder.bind(this)}       
    />
    </a>

但是，我遇到两个问题

首先，网络应用尝试在传递前下载json文件

 this.setState({...this.state,Json_String:  JSON.stringify(res.data[0])});
         this.setState({...this.state,Project_NUM:  proj.Company_ID});

我认为，我需要将json和Project_NUM分配给构造函数，以便可以通过单击按钮事件下载json文件。

第二，即使我初始化类似“无” webapp的构造函数，也无法下载json文件...

我在想使用“ .get”之后，它传递了“ res”以获取Object中的数据，因此我可以准备下载json文件。但是，我不确定为什么... Web在尝试通过 this.setState 之前尝试下载json文件。我犯了什么错误吗？还是对Reactjs编程的误解？

从reactjs生成并下载json文件

0 个答案: