Skip to content

Instantly share code, notes, and snippets.

@insin

insin/blocks.jsx

Last active September 30, 2015 15:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save insin/8903094 to your computer and use it in GitHub Desktop.
Save insin/8903094 to your computer and use it in GitHub Desktop.
Download ZIP
Block-based template inheritance in React? What would the API look like?
Raw
blocks.jsx
/** @jsx React.DOM */
var Block = React.createClass({
render: function() {
}
})
var Base = React.createClass({
render: function() {
return <html>
<head>
<meta charset="UTF-8"/>
<title>Blocks?</title>
</head>
<body>
<h1>Test</h1>
<div id="content">
<Block ref="content"/>
</div>
</body>
</html>
}
})
var TwoCols = React.createClass({
render: function() {
return <Base>
<Block ref="content">
<div className="left">
<Block ref="left"/>
</div>
<div className="right">
<Block ref="right"/>
</div>
</Block>
</Base>
}
})
var Page = React.createClass({
render: function() {
return <TwoCols>
<Block ref="left">
<p>Hello left world!</p>
</Block>
<Block ref="right">
<p>Hello right world!</p>
</Block>
</TwoCols>
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment