Skip to content

Instantly share code, notes, and snippets.

@jeccb-zz
Created October 31, 2016 19:34
Show Gist options
  • Save jeccb-zz/b3c3fdef03417faf598614026920fb76 to your computer and use it in GitHub Desktop.
Save jeccb-zz/b3c3fdef03417faf598614026920fb76 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>React - Aula 01</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react-with-addons.js"></script>
</head>
<body>
<div id="aula-01"></div>
<script type="text/babel">
<!-- Criando um componente react -->
class App01 extends React.Component{
constructor(){
super();
this.state = {
contador:0,
}
}
_somarContador(valor){
this.setState({
contador: this.state.contador + valor,
})
}
<!-- o render defini/gera o output do nosso componente -->
render(){
return (
<div>
<h1>Hello World</h1>
<button onClick={() => this._somarContador(1)}>Somar</button>
<span>{this.state.contador}</span>
<button onClick={() => this._somarContador(-1)}>Subtrair</button>
</div>
);
}
}
React.render(<App01/>, document.getElementById('aula-01'));
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment