i was preparing for an interview and working with questions given on google, i have created everything perfectly well,but what i want for data to be loaded after clicking the button, but i think i am making an error, how am i supposed to do that? can anyone guide me.

```
import "./styles.css";
import {useEffect, useState} from 'react'
import axios from 'axios'

export default function App() {
  const[count, setCount] = useState(0)
  const[randomUserDataJSON, setRandomUserDataJSON] = useState('')

  useEffect(() => {
    fetchRandomData().then(randomData=> {
      setRandomUserDataJSON(randomData ||'' )
    })
  }, [])

  const fetchRandomData = () => {
    return axios.get('https://randomuser.me/api')
    .then(({data}) => {
      console.log(data);
      return JSON.stringify(data)
    })
    .catch(error => {
      console.log(error)
    })
  } 

  return (
    <div className="App">
      <h2>how to implemenet useEffect</h2>
      <button onClick="randomUserDataJSON">Fetch Random Data</button>
      <pre>  </pre>

    </div>
  );
}

```

note also tried:

```
<button onClick={randomUserDataJSON}>Fetch Random Data</button>

```