scrimba
Reusable React
Fundamentals
Custom Events and Props
Go Pro!Bootcamp

Bootcamp

Study group

Collaborate with peers in your dedicated #study-group channel.

Code reviews

Submit projects for review using the /review command in your #code-reviews channel

Custom Events and Props
AboutCommentsNotes
Custom Events and Props
Expand for more info
index.js
run
preview
console
import React from 'react';
import ReactDOM from 'react-dom';

// const reactElement = <div className="fish">Heellllooooo</div>

const Button = ({ children }) => {
return <button>{children}</button>
}

const domElement = document.getElementById('root')

ReactDOM.render(
<div>
<Button>
+ Add
</Button>
<Button>
Subtract -
</Button>
<Button children="MULTIPLY *****" />
</div>, domElement)

<Button>
{element}
{element2}
{stuff.map(() => {element3and4})}
</Button>

React.createElement(Button, {}, element, element2, [element3, element4])
React.createElement(Button, {children: [element, [element2, [element3, element4]})


// <Button children={element} />
// React.createElement(Button, { children: element })

// <Button>{element}</Button>
// React.createElement(Button, {}, element)
// React.createElement(Button, { children: element })
Console
/index.html
-7:52