46 lines
1.2 KiB
JavaScript
46 lines
1.2 KiB
JavaScript
|
import React from 'react';
|
||
|
|
|
||
|
|
import ListElement from "./ListElement";
|
||
|
|
import style from './ListContainer.module.css';
|
||
|
|
|
||
|
|
class ListContainer extends React.Component {
|
||
|
|
constructor(props, context) {
|
||
|
|
super(props, context);
|
||
|
|
|
||
|
|
this.state = {
|
||
|
|
elements: [],
|
||
|
|
title: "Container of Elements"
|
||
|
|
}
|
||
|
|
|
||
|
|
this.handleclick = this.handleclick.bind(this);
|
||
|
|
}
|
||
|
|
|
||
|
|
render() {
|
||
|
|
return (
|
||
|
|
<div className={style.mainbody}>
|
||
|
|
<div className={style.title}>
|
||
|
|
{this.state.title}
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<button onClick={this.handleclick}>click me</button>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
{
|
||
|
|
this.state.elements.map((elemname) => (
|
||
|
|
<ListElement></ListElement>
|
||
|
|
))
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
handleclick() {
|
||
|
|
let elems = this.state.elements;
|
||
|
|
elems.push("TESTNAME");
|
||
|
|
this.setState({elements: elems, title: "Container of several Elements"});
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default ListContainer;
|