Skip to content

Instantly share code, notes, and snippets.

@RyanAtViceSoftware

RyanAtViceSoftware/fiddle.html

Last active May 30, 2017 10:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save RyanAtViceSoftware/4a834a92e69755964f4f to your computer and use it in GitHub Desktop.
Save RyanAtViceSoftware/4a834a92e69755964f4f to your computer and use it in GitHub Desktop.
Download ZIP
Hello React - state - how to use state to create dynamic behavior. JsFiddle: http://jsfiddle.net/gh/gist/library/pure/4a834a92e69755964f4f/
Raw
fiddle.html
<script src="https://fb.me/react-with-addons-0.14.0.js"></script>
<script src="https://fb.me/react-dom-0.14.0.js"></script>
<div id="view"/>
Raw
fiddle.js
var HelloReact = React.createClass({
getInitialState: function() {
return {
message: 'I am from default state'
};
},
updateMessage: function(e) {
this.setState({message: e.target.value});
},
render: function() {
return (
<div>
<input type='text' onChange={this.updateMessage}/>
<div>Hello React</div>
<div>{this.state.message}</div>
</div>
);
}
});
ReactDOM.render(
<HelloReact />,
document.getElementById('view'));
Raw
fiddle.manifest
name: ReactJs example by Ryan Vice - www.ViceSoftware.com
description: Hello React - props - how to pass default prop values.
authors:
- Ryan Vice
resources:
normalize_css: no
wrap: h
panel_js: 3
panel_css: 0
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment