Skip to content

Instantly share code, notes, and snippets.

@michaelrambeau
Last active August 29, 2015 14:24
Show Gist options
  • Save michaelrambeau/48457e5504be40cfa2c4 to your computer and use it in GitHub Desktop.
Save michaelrambeau/48457e5504be40cfa2c4 to your computer and use it in GitHub Desktop.
An introduction to modern JavaScript: ES6, modules... ref: http://qiita.com/michaelrambeau/items/bf079b5b48507792807f
<tbody>
{ entries.map( function (entry, i) {
return(<RestoreLogList.Entry
entry={ entry }
key={ i }
/>);
}
) }
</tbody>
<tbody>
{ entries.map( function (entry, i) {
return(<RestoreLogList.Entry
entry={ entry }
key={ i }
/>);
}
) }
</tbody>
<tbody>
{ entries.map( (entry, i) =>
<RestoreLogList.Entry
entry={ entry }
key={ i }
/>
) }
</tbody>
<tbody>
{ entries.map( (entry, i) =>
<RestoreLogList.Entry
entry={ entry }
key={ i }
/>
) }
</tbody>
var self = this;
var self = this;
<div className="btn-group">
{ this.props.options.map(
function (item, i) {
return (<button
key={ i }
type="button"
className={ 'btn' + (self.props.value == item ? ' active' : '') }
onClick={ function () { self.props.onChange(item); } }
>
{ item }
</button>);
}
)}
</div>
<div className="btn-group">
{ this.props.options.map(
function (item, i) {
return (<button
key={ i }
type="button"
className={ 'btn' + (self.props.value == item ? ' active' : '') }
onClick={ function () { self.props.onChange(item); } }
>
{ item }
</button>);
}
)}
</div>
<div className="btn-group">
{ this.props.options.map( (item, i) =>
<button
key={ i }
type="button"
className={ 'btn' + (this.props.value == item ? ' active' : '') }
onClick={ () => this.props.onChange(item) }
>
{ item }
</button>
) }
</div>
<div className="btn-group">
{ this.props.options.map( (item, i) =>
<button
key={ i }
type="button"
className={ 'btn' + (this.props.value == item ? ' active' : '') }
onClick={ () => this.props.onChange(item) }
>
{ item }
</button>
) }
</div>
var x = data.x;
var y = data.y;
var z = data.z;
var React = require('react');
var MyComponent = React.createClass({
handleSubmit: function(e) {
},
render: function() {
}
});
module.exports = MyComponent
let {x, y, z} = data;
import React from "react";
import { getData } from "../../common/request";
export default class MyComponent extends React.Component {
handleSubmit(e) {
}
render() {
let { title } = this.props.data.landing;
return (
<div id="landing-page">
<h1>{title}</h1>
</div>
);
}
}
var MyComponent = React.createClass({
handleSubmit: function(e) {
},
render: function() {
}
});
var React = require('react');
var MyComponent = React.createClass({
handleSubmit: function(e) {
},
render: function() {
}
});
module.exports = MyComponent
import React from "react";
import { getData } from "../../common/request";
export default class MyComponent extends React.Component {
handleSubmit(e) {
}
render() {
let { title } = this.props.data.landing;
return (
<div id="landing-page">
<h1>{title}</h1>
</div>
);
}
}
import React from "react";
export default class MyComponent extends React.Component {
handleSubmit(e) {
}
render() {
}
}
import MyComponent from './path/to/my-component.jsx';
<MyComponent />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment