React JS:如何在全部导出到Excel中将字符串记录计数转换为整数

时间:2019-03-10 04:48:51

标签: excel reactjs

我正在使用全部导出到Excel功能将React表数据导出到Excel工作表中。所有数据都将以字符串格式插入,但是我希望记录计数以整数格式存储,但是它以字符串格式存储。

全部导出到Excel代码:

<div id="excelLayer">
    <Workbook filename='DownloadedReport.xlsx' element={<a href="javascript:void(null)" className='excel_div'>Export all to Excel</a>}>
    <Workbook.Sheet data={this.state.data} name="Table Data">
    <Workbook.Column label="From" value="senderID"/>
    <Workbook.Column label="To" value="receiverID"/>
    <Workbook.Column label="Transaction File" value="fileName"/>
    <Workbook.Column label="Transaction Date" value="transationDate"/>
    <Workbook.Column label="Record Count" value="recordCount"/>
    <Workbook.Column label="Status" value="status"/>
    </Workbook.Sheet>
    </Workbook>
</div>

反应表记录计数列代码:此代码用于记录计数列排序。

{Header: 'Record Count',accessor: 'recordCount', style: {textAlign: "center"},
  sortMethod: (a, b) => {
    if (isNaN(a) || isNaN(b)) {
      return a > b ? 1 : -1;
      }
      return a - b;
    }
  },

导出的Excel数据:

enter image description here

如何在代码中处理此问题,以便将数据自动存储为整数?

1 个答案:

答案 0 :(得分:0)

您能确定要提供recordCount值作为字符串吗?

我尝试将 react-excel-workbook 与整数值一起使用,并且下载的excel是正确的。 而且,如果我使用字符串,则excel具有字符串格式的值。

注意:假设您的“ recordCount”始终为int,我一直使用parseInt。如果它可以浮动,请相应地修改<Workbook.Column label="recordTotal" value={row => parseInt(row.recordTotal)} />

import React, { Component } from 'react';
import './App.css';
import Workbook from 'react-excel-workbook'

class App extends Component {

  render() {
    const data1 = [
      {
        recordTotal: '123',
        status: 'Not started',
      },
      {
        recordTotal: '12',
        status: 'in progress',
      },
      {
        recordTotal: '111',
        status: 'Completed',
      }
    ]

    return (
      <div className="App">
        <Workbook filename="example.xlsx" element={<a href="javascript:void(null)" className='excel_div'>Export all to Excel</a>}>
          <Workbook.Sheet data={data1} name="Sheet A">
            <Workbook.Column label="recordTotal" value={row => parseInt(row.recordTotal)}  />
            <Workbook.Column label="status" value="status" />
          </Workbook.Sheet>
        </Workbook>

      </div>
    );
  }
}

export default App;

下面是下载的excel。

enter image description here