Discussion on "Learn React Hooks and Context API by building a Recipe Search App (Part 2)"

Ola John · 2019-07-04T08:58:18.612Z

This is the second part of the series in learning React Hooks and the Context API. In the first part we learn the basics of useState, built the first parts of the Recipe Search application. The full code can be found on github Overview of what we'll...

Hi, need me little help with use context. Exactly I wish use data from

function noviPodaci() { fetch("localhost/posts.json") .then(response => { return response.json(); }) .then(json => { console.log("parsed json iz funkcije noviPodaci", json); alert([json.name, json.id, json.email]); }) .catch(function(ex) { console.log("parsing failed", ex); }); } to import React from "react"; import "whatwg-fetch";

export const CTX = React.createContext();

export default function Store(props) { const statHooks = React.useState({ color: colors, naziv: ime, new: "data of function });

return ( <CTX.Provider value={statHooks}> <div>{props.children}</div> </CTX.Provider> ); }

How do that? You can see all code at codesandbox.io/s/naughty-hypatia-swsqm Thanks Mr.Miodrag

A couple of things are not right with your implementation.

When you fetch the data from a local json, your fetch should look like so: fetch("../../posts.json").
The function fetching the data should be called from within the component not outside, and there is no point exporting it. I refactored that .
You will the call the noviPodaci() inside use effect like so: useEffect(()=> { noviPodaci() },[])
You are trying to use the useContext hook like useState. It doesn't work like that.

I refactored the Store.js. Check it out here and try to read this tutorial again and refactor the rest. codesandbox.io/s/react-context-fm738

Search Hashnode

Learn React Hooks and Context API by building a Recipe Search App (Part 2)

Responses(1)