React
HTML
<div id="app"></div>
CSS
body {
background: #20262E;
padding: 20px;
font-family: Helvetica;
}
#app {
background: #fff;
border-radius: 4px;
padding: 20px;
transition: all 0.2s;
}
li {
margin: 8px 0;
}
h2 {
font-weight: bold;
margin-bottom: 15px;
}
.done {
color: rgba(0, 0, 0, 0.3);
text-decoration: line-through;
}
input {
margin-right: 5px;
}
React
function getItems() {
return Array.from({ length: 6 }).map((_, i) => <p>{i}</p>);
}
function discardWarning(args) {
return React.createElement(React.Fragment, null, ...args);
}
class App extends React.Component {
render() {
return (
<div>
<div>
{getItems()}
</div>
<div>
{discardWarning(getItems())}
</div>
</div>
)
}
}
ReactDOM.render(<App />, document.querySelector("#app"))