Problem using SpreadJS with typescript

Problem using SpreadJS with typescript

Posted by: grazielleconceicao on 24 May 2022, 9:29 am EST

• 

  grazielleconceicao

  • Post Options:
  • Link
    Copy

  Posted 24 May 2022, 9:29 am EST

  I’m trying using the spreadjs with Typescript and ReactJS, but ocurre this error:

  ‘SpreadSheets’ cannot be used as a JSX component.
  
  Its instance type ‘SpreadSheets’ is not a valid JSX element.
  
  The types returned by ‘render()’ are incompatible between these types.
  
  Type ‘React.ReactNode’ is not assignable to type ‘import(“C:/Users/g.conceicao/Documents/projetos/asssetplus2.0/node_modules/@types/react-table/node_modules/@types/react/index”).ReactNode’.
  
  Type ‘{}’ is not assignable to type ‘ReactNode’.ts(2786)

  Follow the code below:

  
   <div>
              <SpreadSheets
                  workbookInitialized={spread => setSpread(spread)}
                  name="Asset"
              >
                  <Worksheet name="Asset+" />
              </SpreadSheets>
          </div>
  
  

  Waiting by answer to resolve my problem.

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 25 May 2022, 3:29 am EST

  Hi,

  We are sorry but we are unable to replicate the issue on our end. Could you please share a working sample that replicates the issue so that we can investigate it further and help you accordingly? You may also refer to the following react typescript sample and modify it to replicate the issue.

  Regards,
  
  Avinash

  react-starter-typescript-app.zip

• 

  grazielleconceicao

  • Post Options:
  • Link
    Copy

  Posted 25 May 2022, 9:15 am EST

  The problem was versions the typescript. I updated and it worked.

  Another problem, i have styles to inserted in my sheet and some functions change the data dynamically, but the styles and formatting exit at each changed. Has some shape to insert the styles and formatting a only once to all columns?

• 

  avinash.pathak

  

  • Post Options:
  • Link
    Copy

  Posted 26 May 2022, 12:43 am EST

  Hi,

  We are glad to know that the previous issue has been resolved.

  If you want to apply the style to multiple cells you may use the following code snippet.

  let style = new GC.Spread.Sheets.Style();
  style.backColor = "red";
  sheet.getRange(0,0,sheet.getRowCount(),sheet.getColumnCount()).setStyle(style);
  
  

  setStyle: https://www.grapecity.com/spreadjs/docs/latest/online/SpreadJS~GC.Spread.Sheets.CellRange~setStyle.html