Skip to content

Instantly share code, notes, and snippets.

@jaf7
Forked from ChaseWest/react-table-component.js
Created March 4, 2019 01:20
Show Gist options
  • Save jaf7/b88ea7e5eb6d000dbb8d3949720c9ef9 to your computer and use it in GitHub Desktop.
Save jaf7/b88ea7e5eb6d000dbb8d3949720c9ef9 to your computer and use it in GitHub Desktop.
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);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment