React Hooks Example: Timer

Simple React Hooks example. A timer that pauses when you hold the mouse button. Creates and uses a custom Hook.

by wsypeter

HTML

<div id="app"></div>

CSS

.timer {
  padding: 20px;
  font-size: 40px;
}

React

// Custom Hook: useMousePressed

function Timer () {
  // Timer
	const [countries, setCountries] = React.useState([])	
	React.useEffect(async() => {
  	let res = await fetch ('https://restcountries.com/v2/all')
    let data = await res.json()
    let country = data.map(ele => ele.name)
    setCountries(country)
  }, [])

	   function helper(value){
     console.log(value)
     }

  return (
    <div className='timer'>
    <select onChange= {(e) =>  helper(e.target.value)} >
            {countries.map((value) => (
                <option  key={value} value={value}>{value}</option>
            ))}
    </select>
    </div>
  )
}

ReactDOM.render(<Timer />, document.querySelector("#app"))