CODEWITHSUNDEEP
javascriptreactjs
Ayaz
Ayaz

Reputation: 2121

Reactjs - Export to Excel using xlsx.utils.json_to_sheet

I am using xlsx npm package to export data to excel. The following code is working as expected and data is exported. I need to apply some style as below. Please help.

  1. Header should be bold.
  2. Header background should be gray
  3. Apply border

Import statement

import * as XLSX from 'xlsx';

Code:

var data = [
  {"name":"John", "city": "Seattle"},
  {"name":"Mike", "city": "Los Angeles"},
  {"name":"Zach", "city": "New York"}
];
let header = ["Name", "City"];
const ws = XLSX.utils.book_new();
XLSX.utils.sheet_add_aoa(ws, [header]);
XLSX.utils.sheet_add_json(ws, data, { origin: 'A2', skipHeader: true });
const wb = { Sheets: { 'data': ws }, SheetNames: ['data'] };
const excelBuffer = XLSX.write(wb, { bookType: fileType, type: 'array', cellStyles:true });
const finalData = new Blob([excelBuffer], { type: fileFormat });
FileSaver.saveAs(finalData, "Data.xlsx");

Actual Output:

enter image description here

Expected Output:

enter image description here

Upvotes: 3

Views: 22318

Answers (1)

Zunayed Shahriar
Zunayed Shahriar

Reputation: 2723

You cannot do this with xlsx aka SheetJS because it is probably a SheetJS Pro feature.

You can do it with xlsx-populate.

Demo at CodeSandbox.

Upvotes: 4

Related Questions