反应JS:下载JSON格式的文件上点击下载按钮

问题描述 投票:0回答:1

我想下载关于与来自该行的值传递的价值该行的文件,是越来越创建,甚至在我点击下载按钮下载的文件,我使用的反应,filedownload包和filedownload方法相同,但未能如愿。我需要如何解决这个输入:

class displayBlank {

handleDownload(col 1,col2)
{

    var data = "This is an example JSON";
    var fileDownload = require('react-file-download');
    fileDownload(data, 'filename.json');

}

render(){
                    <table >
                      <thead>
                        <tr role="row">
                          <th>COL 1</th>
                          <th>COL 2</th>
                          <th>COL 3</th>
                          <th>COL 4</th>
                          <th>COL 5</th>
                          <th>COL 6</th>
                          <th>COL 7</th>
                          <th>COL 8</th>
                          <th>COL 9</th>
                        </tr>
                      </thead>
                      <tbody>
                        {this.state.pageOfItems.map((item, i) => {
                          return (
                            <tr key={i}>
                              <td >{item.COL1}</td>
                              <td> {item.COL2}</td>
                              <td> {item.COL3}</td>  
                              <td> {item.COL4}</td>  
                              <td> {item.COL5}</td>
                              <td> {item.COL6}</td>
                              <td style={{color: 'white', fontWeight: 'bold', backgroundColor: item.COL 7 === 'VALUE' ? 'red' : 'green'}}>{item.COL7}</td>
                              <td >{item.COL 8 === 'VALUE1' ? (<div><Button bsStyle="primary" type="submit" bsSize="small" onClick={this.handleDownload(item.COL1,item.COL2)}>DOWNLOAD</Button></div>) : (<div></div>)}</td>
                            </tr>
                          );
                        })}


                      </tbody>
                    </table>
                    }
                    }

该文件会变得点击下载按钮和特定的行值不被传递到handleDownload功能之前下载。

javascript reactjs
1个回答
0
投票
onClick={() => this.handleDownload(item.COL 1,item.COL 2)}

您呼叫的功能,而不是你应该使用回调像上面。

© www.soinside.com 2019 - 2024. All rights reserved.