SHARE
TWEET

Untitled

a guest Sep 17th, 2019 99 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. function Button(props) {
  2.   const handleClick = () => props.onClickFunction(props.increment)
  3.  
  4.   return (
  5.     <button onClick={ handleClick }>
  6.       +{props.increment}
  7.     </button>
  8.     )
  9. }
  10.  
  11. function Display(props) {
  12.   return (
  13.     <div>{props.message}</div>
  14.   )
  15. }
  16.  
  17. function App() {
  18.   const [ counter, setCounter ] = useState(0)
  19.   const incrementCounter = ( incrementValue ) => setCounter( counter + incrementValue)
  20.  
  21.    
  22.   return (
  23.     <div>
  24.       <Button onClickFunction={incrementCounter} increment={1} />
  25.       <Button onClickFunction={incrementCounter} increment={5} />
  26.       <Button onClickFunction={incrementCounter} increment={10} />
  27.       <Button onClickFunction={incrementCounter} increment={100} />
  28.       <Display message={ counter }/>
  29.     </div>
  30.   )
  31. }
  32.  
  33.  
  34. ReactDOM.render(
  35.   <App />,
  36.   document.getElementById('mountNode')
  37. )
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top