Am i using the hooks correctly by having it right before returning the JSX?
I also want to reference this handsontable from a different javascript file, how can i do that? For example, i have an onClick button in another react component that wants to grab all the data from this handsontable, how can the other react component reference this HotTable in this component in order to get all the data thats in this table? Thank you!
Hey Aleksandra, thanks for your response. I just looked over the example on codepen and it doesn’t see to have what i am looking for. Maybe i need to further explain what i am looking for.
The following code is in a non react component.
I am grabbing the element with the id ‘EventProductionNotesContainer’ that is located in a react component.
> var createEventProductionNotesContainer = document.getElementById('EventProductionNotesContainer');
> var editableEventProduction = new Handsontable(createEventProductionNotesContainer, { //Code omitted for abbreviation })
In a different react component, i want to access all the data in “editableEventProduction” instance, how can i do that?
I think the demo it’s a good way of getting to where i want to go.
I changed the code body of the onClick function in the Button Component to the following:
handleClick = () => {
var hotInstance = this.hotTableComponent.current.hotInstance;
var exportPlugin = hotInstance.getPlugin(‘exportFile’);
return exportPlugin.downloadFile(‘csv’, {filename: ‘Exported CSV File’});
}
I want the button to export the data from the Handsontable in ExampleComponent, but when referencing this.hotTableComponent in the handClick function it was giving me the following error:
TypeError: Cannot read property ‘hotInstance’ of null
How do i solve that issue without having to place the button in the ExampleComponent?