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

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

Mio Ttraja

Jul 15, 2019

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

Ola John

Full-stack JavaScript Developer

Jul 15, 2019

Hey, I am checking this. It's a bit slower since I can't fully understand what your code is intended to do and some of the functionalities are not in English.But I will try to get back with a solution/

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