Created
September 15, 2018 18:43
-
-
Save apuravchauhan/d4a1111fe33a41f10f4aadb5f3a38255 to your computer and use it in GitHub Desktop.
Java freemarker template converted from ReactJS JSX component
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <title>Apurav Chauhan</title> | |
| </head> | |
| <body> | |
| <div id="root"> | |
| <div> | |
| <button onClick="{this.changeState}"> | |
| Like | |
| </button> | |
| <#if isLiked==true><span>You like it</span></#if> | |
| </div> | |
| </div> | |
| <script type="text/babel" id="buttoncomponent"> | |
| class LikeButton extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| this.state = { liked: false }; | |
| this.changeState = this.changeState.bind(this); | |
| } | |
| changeState(){ | |
| this.setState({ liked: true }) | |
| } | |
| render() { | |
| const isLiked = this.state.liked; | |
| return <div> | |
| <button onClick={this.changeState}> | |
| Like | |
| </button> | |
| {isLiked==true && | |
| <span>You like it</span> | |
| } | |
| </div> | |
| } | |
| } | |
| </script> | |
| <script type="text/babel"> | |
| ReactDOM.render( | |
| <LikeButton/>, | |
| document.getElementById('root') | |
| ); | |
| </script> | |
| <script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script> | |
| <script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script> | |
| <script src="https://unpkg.com/[email protected]/babel.min.js"></script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment