Home > Blockchain >  I am making a React App with CocktailDB API, but axios won't perform the GET request. The brows
I am making a React App with CocktailDB API, but axios won't perform the GET request. The brows

Time:11-09

I am using createContext to send the State to the rest of the components. Because the app is small, I decided to put the Context and functions in the same file. I am using the free version of cocktailDB API, but axios won't get it. It says that it can't find the resource. I want to call the API only once.

ContextCategories.js

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

//Creating the CONTEXT
export const ContextCategories = createContext(); //Reference to the context


//Creating the PROVIDER
const CategoriesProvider = (props) => {

//Creating the STATE of the CONTEXT
const [categories, setCategories] = useState([]);

//Calling the API
useEffect(()=>{
    const cocktailCategories = () =>{
       
        const URL = "www.thecocktaildb.com/api/json/v1/1/list.php?c=list";
            const myCategories = axios.get(URL);
            console.log(myCategories);                            
    }
    cocktailCategories();
},[]);

return(                
    <ContextCategories.Provider
        value={{
          
        }}
    >
        {props.children}
    </ContextCategories.Provider>
);

};

export default CategoriesProvider;

CodePudding user response:

I believe you may need the http:// at the beginning of your url. Hope that helps. If you get a chance please take a look and upvote the following OnClick fires for another buttons click event

  • Related