React Base Fiddle (JSX)
Starting point for creating JSFiddles with React. This uses React with Addons.
by _alexander_
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>
<div id="container">
<!-- This element's contents will be replaced with your component. -->
</div>
JavaScript 1.7
var App = React.createClass({
columns: function(condition) {
const result = this.props.data.find(e => e.title === condition);
if (result && result.columns) {
return result.columns
.map((column, index) => <p key={ index }>{ column.name }</p>);
}
return [];
},
render: function() {
const condition = 'Table 1';
return <div>{ this.columns( condition ) }</div>;
}
});
const data = [{
lookups: [],
rows: [{data: {a: 1, b: 2}}, {data: {a: 3, b: 4}}],
title: "Table 1",
columns: [{name: "a"}, {name: "b"}]
}, {
lookups: [],
rows: [{data: {c: 5, d: 6}}, {data: {c: 7, d: 8}}],
title: "Table 2",
columns: [{name: "c"}, {name: "d"}]
}];
ReactDOM.render(
<App data={ data } />,
document.getElementById('container')
);