Search code examples
reactjssharepointframework

SharePoint Framework SPFx & React

I'm new for SharePoint SPFx and React, got a question, the code generated by gulp below:

export default class HelloReactWebPart extends BaseClientSideWebPart<IHelloReactWebPartProps> {
  public render(): void { 

    const element: React.ReactElement<IHelloReactProps> = React.createElement(
      HelloReact,
      {
        description: this.properties.description
      }
    );

    ReactDom.render(element, this.domElement);

  }

Is there a way to create the element using JSX, not use React.ReactElement, like something below:

const element: React.ReactElement<IHelloReactProps> = 
        <HelloReact description={this.properties.description} />

Thanks!

Solution

  • Yes, it works, all I need to do is rename the filename generated by the template, change the filename "HelloReactWebPart.ts" to "HelloReactWebPart.tsx".

    Here is the screenshot