List of components
1. component with react state: my-input
Custom element input field: Contains react state. Start typing to see:
Live demo:
Code:
2. props passed via html attributes: my-button
Custom element button element that accepts props via html attributes. Check console log on click. Also, Try editing the attribute text with chrome inspector.
Live demo:
Code:
3. child html elements passed to react: my-complex-component
child html elements can be passed to a custom element made with react.
In this case those can be accessed via
this.props.children as you would in a regular react app.
Only caveat is that, since these child html elements are dom nodes we
wrap them in a wrapper react component so that react can understand
it.
Live demo:
I am a child element
I am another childish