Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
JS Bin // source https://jsbin.com/zexipob
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="https://fb.me/react-15.1.0.js"></script>
<script src="https://fb.me/react-dom-15.1.0.js"></script>
<style>
body {font-family:Fira code; font-size:13px;}
</style>
<title>JS Bin</title>
</head>
<body>
<div id="app"></div>
<script id="jsbin-javascript">
"use strict";
var data = {
"kitSearch": {
"kits": [{
"id": ["cesar"],
"configurations": [{
"id": ["20"],
"name": ["Canales_favoritos"]
}, {
"id": ["584"],
"name": ["hhola"]
}]
}, {
"id": ["telmex"],
"configurations": [{
"id": ["30"],
"name": ["Conf_Editada_Kit2"]
}]
}],
"msg": ["Operacion exitosa"],
"msgCode": ["OPERATION_SUCCESS"],
"msgType": ["0"]
}
};
var App = React.createClass({
displayName: "App",
render: function render() {
var kits = data.kitSearch.kits.map(function (kit, i, u) {
var kitsKeys = Object.keys(data.kitSearch.kits[i]);
//console.log("Content keys: ", kitsKeys);
console.log("KIT: " + kit.id);
var kitConfigs = kit.configurations;
var kitCC = [];
var children = kit.configurations;
children.forEach(function (item) {
console.log(">> CONF: (" + item.id + ") " + item.name);
kitCC.push(item);
//console.log(item);
});
var kitCC2 = kitCC.map(function (item, u) {
return React.createElement(
"div",
{ key: u },
" >> CONF: (",
item.id,
") ",
item.name
);
});
return React.createElement(
"div",
{ key: i },
"KIT: (",
kit.id,
") **",
React.createElement("br", null),
kitCC2,
React.createElement("br", null),
React.createElement("br", null)
);
});
return React.createElement(
"div",
null,
kits
);
}
});
ReactDOM.render(React.createElement(App, null), document.getElementById("app"));
</script>
<script id="jsbin-source-javascript" type="text/javascript">var data = {
"kitSearch": {
"kits": [
{
"id": ["cesar"],
"configurations": [
{
"id": ["20"],
"name": ["Canales_favoritos"]
},
{
"id": ["584"],
"name": ["hhola"]
}
]
},
{
"id": ["telmex"],
"configurations": [
{
"id": ["30"],
"name": ["Conf_Editada_Kit2"]
}
]
}
],
"msg": ["Operacion exitosa"],
"msgCode": ["OPERATION_SUCCESS"],
"msgType": ["0"]
}
};
var App = React.createClass({
render: function() {
var kits = data.kitSearch.kits.map((kit, i, u) => {
var kitsKeys = Object.keys(data.kitSearch.kits[i]);
//console.log("Content keys: ", kitsKeys);
console.log("KIT: " + kit.id);
var kitConfigs = kit.configurations;
var kitCC = [];
var children = kit.configurations;
children.forEach(function(item){
console.log(">> CONF: ("+item.id+") "+item.name);
kitCC.push(item);
//console.log(item);
});
var kitCC2 = kitCC.map((item, u) => {return (<div key={u}> >> CONF: ({item.id}) {item.name}</div>)});
return (
<div key={i}>KIT: ({kit.id}) **<br />{kitCC2}<br/><br/></div>
);
});
return (
<div>{kits}</div>
)
}
});
ReactDOM.render(<App/>, document.getElementById("app"));</script></body>
</html>
"use strict";
var data = {
"kitSearch": {
"kits": [{
"id": ["cesar"],
"configurations": [{
"id": ["20"],
"name": ["Canales_favoritos"]
}, {
"id": ["584"],
"name": ["hhola"]
}]
}, {
"id": ["telmex"],
"configurations": [{
"id": ["30"],
"name": ["Conf_Editada_Kit2"]
}]
}],
"msg": ["Operacion exitosa"],
"msgCode": ["OPERATION_SUCCESS"],
"msgType": ["0"]
}
};
var App = React.createClass({
displayName: "App",
render: function render() {
var kits = data.kitSearch.kits.map(function (kit, i, u) {
var kitsKeys = Object.keys(data.kitSearch.kits[i]);
//console.log("Content keys: ", kitsKeys);
console.log("KIT: " + kit.id);
var kitConfigs = kit.configurations;
var kitCC = [];
var children = kit.configurations;
children.forEach(function (item) {
console.log(">> CONF: (" + item.id + ") " + item.name);
kitCC.push(item);
//console.log(item);
});
var kitCC2 = kitCC.map(function (item, u) {
return React.createElement(
"div",
{ key: u },
" >> CONF: (",
item.id,
") ",
item.name
);
});
return React.createElement(
"div",
{ key: i },
"KIT: (",
kit.id,
") **",
React.createElement("br", null),
kitCC2,
React.createElement("br", null),
React.createElement("br", null)
);
});
return React.createElement(
"div",
null,
kits
);
}
});
ReactDOM.render(React.createElement(App, null), document.getElementById("app"));
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment