ReactJS class 组件和功能组件如何从普通 Javascript ZC1C425268E68385D1AB50741?

Question

I wanted to call a ReactJS function ( functional Component ) from the normal JavaScript function. Its not printing the output because ReactJS uses the JSX syntax. Is it possible to call ReactJS functional component from the normal JS fucntion? My Example code is here:

class Extra extends React.Component { 
      //This is the ReactJS class component 
}

function Greeting() {
       // This is the ReactJS functional component
      // I wanted to call this ReactJS functional component from the 
      normal JavaScript function 

      return (<Extra/>);
}

function Calling() {
    // This  is normal JavaScript function  which I have defined in the 
     separate file. From this function I wanted to call the ReactJS 
     function.

     Greeting();
}

I tried this. I called ReactJS functional component from the normal JS function. It is going inside the ReactJS function but its not displaying the JSX code on the browser ( JSX sytax of the ReactJS Class component)

Thanks in advance

Answer 1

Yes you can call Component class function from normal javascript function, but you need to make that react function static then call from noraml javascript by className.react_function()

Answer 2

class Extra extends React.Component { 
  //This is the ReactJS class component 

  static Greeting=()=>{
    console.log("Greeting from react class function");
  }
}


function Calling() {
  // This  is normal JavaScript function  which I have defined in the  separate file.From this function I wanted to call the ReactJS function.
 Extra.Greeting();
}