meta data for this page
Differences
This shows you the differences between two versions of the page.
| Next revision | Previous revision | ||
|
programming:react:jsx [2016/08/09 13:48] niziak created |
programming:react:jsx [2020/07/03 09:50] (current) niziak ↷ Page moved from react:jsx to programming:react:jsx |
||
|---|---|---|---|
| Line 1: | Line 1: | ||
| + | ====== React ====== | ||
| + | |||
| + | <code javascript> | ||
| + | <!doctype html> | ||
| + | <html lang="en"> | ||
| + | <head> | ||
| + | <meta charset="utf-8"> | ||
| + | <title>ESP8266 Control</title> | ||
| + | <script src="https://npmcdn.com/react@15.3.0/dist/react.js"></script> | ||
| + | <script src="https://npmcdn.com/react-dom@15.3.0/dist/react-dom.js"></script> | ||
| + | <script src="https://npmcdn.com/babel-core@5.8.38/browser.js"></script> | ||
| + | <script src="https://npmcdn.com/jquery@3.1.0/dist/jquery.min.js"></script> | ||
| + | <script src="https://npmcdn.com/remarkable@1.6.2/dist/remarkable.min.js"></script> | ||
| + | </head> | ||
| + | |||
| + | <body> | ||
| + | |||
| + | <div id="content"></div> | ||
| + | |||
| + | <script type="text/babel"> | ||
| + | var Slider = React.createClass ({ | ||
| + | componentDidMount: function() { | ||
| + | |||
| + | }, | ||
| + | render: function(props) { | ||
| + | |||
| + | } | ||
| + | }); | ||
| + | ReactDOM.render( <Slider />, document.getElementById('content') ); | ||
| + | |||
| + | </body> | ||
| + | </html> | ||
| + | |||
| + | </code> | ||
| + | |||
| ====== Variable inside quotes ====== | ====== Variable inside quotes ====== | ||
| Bad: | Bad: | ||
| - | <code js><img className="image" src="images/{this.props.image}" /></code> | + | <code javascript><img className="image" src="images/{this.props.image}" /></code> |
| Ok: | Ok: | ||
| - | <code js><img className="image" src={"images/" + this.props.image} /></code> | + | <code javascript><img className="image" src={"images/" + this.props.image} /></code> |
| - | <code js><img className="image" src={`images/${this.props.image}`} /></code> | + | <code javascript><img className="image" src={`images/${this.props.image}`} /></code> |