We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

React Spreadsheet: TypeError: Bind must be called on a function when passing sheets array prop

Thread ID:

Created:

Updated:

Platform:

Replies:

150429 Jan 7,2020 05:04 AM UTC Jan 10,2020 03:32 PM UTC ReactJS 5
loading
Tags: Spreadsheet
John Smith
Asked On January 7, 2020 05:04 AM UTC

Hello, 

I am trying to use the React Spreadsheet component as shown but have ran into an issue:

TypeError: Bind must be called on a function
    at bind (<anonymous>)
    at s (index.js:1)
    at ae (index.js:1)
    at t.eval [as cells] (index.js:1)
    at d (index.js:1)
    at t.e.setProperties (index.js:1)
    at ae (index.js:1)
    at t.eval [as rows] (index.js:1)
    at d (index.js:1)
    at t.e.setProperties (index.js:1)

Note the that initialisation looks like this

<Spreadsheet
showRibbon={false}
showFormulaBar={false}
allowSave={false}
sheets={workbook.sheets}
/>

and also note that the workbook is being produced on the server using your XLSIO library. An example snippet of the sheets array I am trying to load:



FYI The JSON we are using is based on this example file

https://file-examples.com/wp-content/uploads/2017/02/file_example_XLS_50.xls

Can you confirm how I can resolve this?




Saranya Dhayalan [Syncfusion]
Replied On January 7, 2020 11:57 AM UTC

Hi John Smith, 
  
Thank you for contacting Syncfusion support. 
  
We have checked your reported query with provided code snippet, we suggest you use the <SpreadsheetComponent/> tag element for to resolve your reported issue. We have created a sample for your reference in that we have rendered the spreadsheet component and your provided xls file is successfully opened on it. Please refer the below sample and documentation link. 
  
Sample link: 
  
Documentation link: 
  
Could you please check the above sample and let us know whether this is fulfilling your requirement, if not please share us more information regarding this. So, that we can analyze based on that and provide you a better solution. The information provided would be great help for us to proceed further. 
  
Regards, 
Saranya D 


John Smith
Replied On January 8, 2020 07:37 AM UTC

Hello, 

Thanks for your reply. I've forked the StackBlitz example and added the example file I am trying to load. Please note that I am trying to pass the data via the sheets property and not by using the openUrl property. I believe the openUrl requires a Syncfusion server component to be running which we are not using. Note that the error message in the StackBlitz is different to my local environment (maybe due to versions being different) but that it still doesn't load. This Excel JSON was produced by the SF XLSIO library. 

FYI I am using the SpreadsheetComponent already but I wrapped it in a component called Spreadsheet. 


SB Error:

Error in /turbo_modules/react-dom@16.9.0/cjs/react-dom.development.js (13813:28)
Objects are not valid as a React child (found: object with keys {columns, name, rows, selectedRange, topLeftCell, usedRange}). If you meant to render a collection of children, use an array instead.
in div (created by t)
in t (created by Default)
in div (created by Default)
in div (created by Default)
in Default

Arunkumar Devendiran [Syncfusion]
Replied On January 9, 2020 03:18 PM UTC

Hi John,  
  
Good day to you. 
 
We have checked your reported query with provided stackblitz sample, we suspect that you are trying to the load the json data to in our EJ2 spreadsheet. We would inform that currently we does not include the save as Json and load from Json support on our EJ2 spreadsheet. We have already considered this feature, and it will be included in our upcoming patch release and appreciate your patience until then. 
 
Regards,  
Arunkumar D 


John Smith
Replied On January 10, 2020 04:07 AM UTC

Hi Arunkumar, 

Thanks for your reply. 

Can you just confirm that you are saying that I cannot use the sheets property to load a JSON object? If that's the case, what is the purpose of the sheets property on the React component. Also, what I am doing is basically the same as shown here in your docs, is it not?


Are there any workarounds until the component is updated? Using the service URL is not an option for me currently. 

Thanks


Arunkumar Devendiran [Syncfusion]
Replied On January 10, 2020 03:32 PM UTC

Hi John, 
  
Good day to you. 
 
We have checked your reported query and we would inform that you can load the json data using sheets property.  We suggest to you use the sheets property on the <SpreadsheetComponent> tag element in this way you can load the json data. We have created the sample for your reference in that we have achieved your requirement. Please refer the below sample link and code snippet. 
 
Code Snippet: 
 
<SpreadsheetComponent sheets={ExcelDoc.Workbook.sheets}></SpreadsheetComponent> 
 
 
 
Sample Link: 
 
Please get back to us if you need further assistance. 
 
Regards, 
Arunkumar D 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon