React (i)

Prop Instances

<div id="app"></div>
<script src="bower_components/react/react.min.js"></script>
<script src="bower_components/react/react-dom.min.js"></script>
<script src="lib/babel-core/browser.min.js"></script>
<script type="text/babel">
var MessageBox = React.createClass({
getInitialState: function () {
Return {
isVisible: true,
Titlemessage: "Hello World (from state oh)",
subMessages: [
"I'll code the bricks.",
"And fancy brick handling,",
"No, the foreman told me to go back and move the bricks..... '
]
}
}
render: function () {
Return (
<div>
<h1>{this.state.titleMessage}</h1>
<SubMessage messages={this.state.subMessages} />
</div>
)
}
};
var SubMessage = React.createClass({
PropTypes: {
messages: React.PropTypes.array.isRequired
}
getDefaultProps: function () {
Return {
Messages: ['default sub message '] / / prevent this.props.messages from not existing
}
}
render: function () {
var msgs = [];
this.props.messages.forEach(function (msg, index) {
Msgs.push (
<p>Menon said: {MSG}</p>
);
};
Return (
<div>{msgs}</div>
)
}
};
var messageBox = ReactDOM.render(
<MessageBox/>,
document.getElementById(‘app‘)
);
</script> 

React (i)