Hello everyone I work on a Java Web project using react and jquery to render dynamic web pages. So I wanted to use the function ReactDOMServer.renderToStaticMarkup (element) to retrieve the html nodes related to the html element but I receive as an error:
***Uncaught ReferenceError: ReactDOMServer is not defined***
I also searched the net to find cdn ReactDOMServer to correct the error but other errors occur. Here is a sample code:
HTML FILE
<!DOCTYPE html>
<html>
<head>
<title>ORION WAMBERT</title>
<style type="text/css">
body{
font-family: "comic sans ms";
}
</style>
</head>
<body>
<div id="root"></div>
<script type="text/javascript" src="react.development.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="react-dom.development.js"></script>
<script type="text/javascript" src="babel.min.js" charset="utf-8"></script>
<script type="text/babel" src="appReact.jsx">
</script>
</body>
</html>
JSX FILE
class Button extends React.Component{
handleClick(e){
ReactDOM.render(<TextView text="HELLO WORLD"/>,$("#root").get(0));
}
render(){
return <button onClick={this.handleClick}>{this.props.value}</button>;
}
}
class TextView extends React.Component{
render(){
return <h3>{this.text}</h3>;
}
}
let element=<Button value="click me"/>;
$("#root").html(ReactDOMServer.renderToStaticMarkup(element));
