Comments (3)
Hi,
Unfortunately this is not supported in the current version of the library.
One way that you could mimic something similar would be to have the final row in the data array be the "total" row.
You could then have a flag on the data to indicate that it should be rendered as a "total" row. From there you could override what is returned in getContent
on the DataTableCell
component.
e.g.
<DataTableCell style={pdfStyles.dataTableRow} weighting={0.6} getContent={(r) => {
if(r.isTotal) {
return <Text style={{fontWeight: "bold"}}>Total</Text>
}
return r.Title;
}}/>
The above code is just for illustrative purposes and may not work out of the box.
You MUST return a valid react-pdf component when rendering a DataTableCell. e.g. Text
, View
etc.
from react-pdf-table.
Thank you for your reply, I was thinking on implementing a solution similar to the one that you describe.
I also tried to derived a class from TableHeader and Change the Table class for something like this, but I'm not sure if It would work it is just an idea:
export class Table extends React.PureComponent<TableProps> {
render() {
let tableHeader: JSX.Element = null;
let tableBody: JSX.Element = null;
let tableFooter: JSX.Element = null;
React.Children.forEach(this.props.children, (c: any) => {
if (c.type === TableHeader) {
tableHeader = c;
} else if (c.type === TableBody) {
tableBody = React.cloneElement(c, {
data: c.props.data ?? this.props.data ?? []
});
} else if (c.Type === TableFooter) {
tableFooter = c;
}
});
return (
<View
style={{
width: "100%",
}}
>
{tableHeader}
{tableBody}
{tableFooter}
</View>
);
}
}
from react-pdf-table.
I think that definitely is something that can be implemented. It would be similar to TableBody
except the data passed through would be all the items in the table.
I will create a task to create the TableFooter
. Thank you for your feedback.
from react-pdf-table.
Related Issues (20)
- Add yarn support HOT 1
- Table ignores padding of parent View. HOT 1
- Override width for a specific Row. HOT 1
- How to get row index? HOT 1
- How to merge cell HOT 1
- styling rows HOT 4
- TableCell and DataTableCell throws an error
- Can we achieve two tables side by sides in a single render HOT 1
- Can we add page breaks HOT 1
- Error when build the project
- Update peerDependencies HOT 6
- Request: Colspan And Rowspan
- need some description
- Possibility to set wrap on TableRow from code HOT 2
- I would like to know how to wrap this table?
- Support React 16, 17 and 18
- How to add header in every page?
- Consolidating react-pdf table packages HOT 2
- running into errors while installing HOT 1
- Error in Next js 13 App routes HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-pdf-table.