How to fetch data with stateless component in react?

How to get API value using axios in react?

Fetching data in the stateless component with react we need to use hooks as useEffect() and useState() hooks, and also using axios plugins. 

Note: If your data is coming as a object then you need to use map() method other wise your data will not show. if you are as a string then use direct as variable.

This is simple example:

import React, { useEffect, useState } from 'react'

import axios from 'axios'

export default () => {

    let [testVar, settestVar] = useState('');

    useEffect( () => {

        axios.get('https://jsonplaceholder.typicode.com/todos/')

        //.then(response => settestVar(response.data))

        .then(response => console.log(response.data))

    }, [])

    return(

        <>

           {testVar}

        </>

    )

}

................................................

const [userData, setUserData] = useState({});

    useEffect(() => {

        axios.get(apiBaseUrl + 'api/users')

            .then(response => {

                // how to set my value: response.data.data

                setUserData(response.data.data)

               // console.log(response.data.data)

            }, error => {

                console.log(error)

            })

    }, [])

.......................................................

import React, { useState, useEffect } from 'react';

import axios from 'axios';

export default() => {
  const [data, setData] = useState({ hits: [] });

  useEffect( () => {

     axios.get('https://hn.algolia.com/api/v1/search?query=redux')

    .then(response => setData(response.data))

  });

  return (

    <ul>

      {data.hits.map(item => (

        <li key={item.objectID}>

          <a href={item.url}>{item.title}</a>

        </li>

      ))}

    </ul>

  );

}

I have used API only for the test purpose. You can use your own API.