Skip to content

Instantly share code, notes, and snippets.

@makarovas
Last active February 14, 2024 17:43
  • Star 5 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save makarovas/31c90461adca1eeb03d023174a0af7d6 to your computer and use it in GitHub Desktop.
import React from 'react';
import ReactDOM from 'react-dom';
class AppComponent extends React.Component {
state = {
numChildren: 0
}
render () {
const children = [];
for (var i = 0; i < this.state.numChildren; i += 1) {
children.push(<ChildComponent key={i} number={i} />);
};
return (
<ParentComponent addChild={this.onAddChild}>
{children}
</ParentComponent>
);
}
onAddChild = () => {
this.setState({
numChildren: this.state.numChildren + 1
});
}
}
const ParentComponent = props => (
<div className="card calculator">
<p><a href="#" onClick={props.addChild}>Add Another Child Component</a></p>
<div id="children-pane">
{props.children}
</div>
</div>
);
const ChildComponent = props => <div>{"I am child " + props.number}</div>;
ReactDOM.render(<AppComponent/>, document.getElementById('root'));
@KirstenSchuhmann
Copy link

Thank you for sharing your code! Helped me a lot for my idea :)

@mateforlife
Copy link

thanks you very much

@sykstra
Copy link

sykstra commented Feb 17, 2023

tysm!!!

@rez-xgen
Copy link

Awesome thanks!

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