I'm trying to add a download button that downloads a dynamic react table on click as a csv File but I'm not sure how to do it..
import React, {Component} from "react";
import DynamicTable from '@atlaskit/dynamic-table';
import styled from 'styled-components';
const Wrapper = styled.div`
min-width: 600px;
th{font-size:13px}
th{font-size:14px} `;
render() {
const { error, isLoaded, shareFilterRows } = this.state;
if (error) {
return <div>Error: {error.message}</div>;
} else if (!isLoaded) {
return <div>Loading Shared Filters...</div>;
} else {
return (<Wrapper>
<div>
<DynamicTable
head={shareFilterHead}
rows={shareFilterRows}
rowsPerPage={10}
defaultPage={1}
loadingSpinnerSize="large"
isLoading={false}
isFixedSize
defaultSortKey="filterID"
defaultSortOrder="ASC"
onSort={() => console.log('onSort')}
onSetPage={() => console.log('onSetPage')}
/>
</div>
</Wrapper>
);
}
}
}
This is how my table gets displayed img. I would appreciate any hint or help to make that button work. Thank you guys.
The table in that library does not look like I can do exporting natively. So you would need to get the data from your shareFilterRows and shareFilterHead, convert it back to json or take the parent data json and convert it to a csv on your own. There are some libraries out there like react-json-to-csv