Create a gist now

Instantly share code, notes, and snippets.

What would you like to do?
React Table Component for creating a very basic html table
var Table = React.createClass({
render: function render() {
var _self = this;
var thead = React.DOM.thead({},
React.DOM.tr({},
this.props.cols.map(function (col) {
return React.DOM.th({}, col);
})));
var tbody = this.props.rows.map(function (row) {
return React.DOM.tr({},
_self.props.cols.map(function (col) {
return React.DOM.td({}, row[col] || "");
}));
});
return React.DOM.table({}, [thead, tbody]);
}
});
var container = document.querySelector("#container");
var tableModel = {
cols: ["Name", "Age"],
rows: [{
"Name": "Chase",
"Age": "27"
}],
}
React.renderComponent(Table(tableModel), container);

Nice! Thank you.

Just a quick note about Line#35: renderComponent has been deprecated. You should use the render function instead.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment