1

I am trying to access the results (here it is the 'body') of the fetch but keep getting this :

Promise {< pending >} proto : Promise [[PromiseStatus]] : "resolved" [[PromiseValue]] : Array(100)

it says resolved but isnt just giving me the array I want.

here is my code

    let Categories =  fetch('http://localhost:3001/categories?' )
                 .then((response) => {
                  var data = response.json();

                 return data;


               }).then((body) => {
                    console.log("fetching categories...")
                    console.log(body.categories)

                 return body.categories
               })


    console.log(Categories)
    export default Categories

the above result comes from the console.log(Categories)

David Schwartz
  • 43
  • 1
  • 6
  • Sounds like you [misunderstand the console output](https://stackoverflow.com/q/23392111/1048572). It shows "resolved" only when you click it, which is after the request succeeded. – Bergi Jan 01 '18 at 11:31

1 Answers1

2

Categories is still a Promise. You have to call .then on it where you import it and you will receive your body.categories in the parameter.

EDIT: Additional info from comments (I can't format it nicely there).

It's async so it can't go to initialState of a Redux store. You should:

  • make an action creator that fetches this data

  • when the data is fetched dispatch an action with this data, e.g: { type: 'CATEGORIES_LOAD', data: data }

  • make a reducer which updates this store

And execute this action creator when your component mounts, e.g. componentWillMount if you also use React.

Michael K. Sondej
  • 963
  • 8
  • 24
  • Should have been more specific... I am trying to import it to be in my redux store. How would I do it with that? – David Schwartz Jan 01 '18 at 10:16
  • Why would you want to import the result of an API call in redux store – Shubham Khatri Jan 01 '18 at 10:18
  • @DavidSS It's async so it can't go to initialState. You should: - make an action creator that fetches this data - when the data is fetched dispatch an action with this data, e.g: ``` { type: 'CATEGORIES_LOAD', data: data } ``` - make a reducer which updates this store And execute this action creator when your component mounts, e.g. componentWillMount if you also use React. – Michael K. Sondej Jan 01 '18 at 10:19
  • I've edited my answer because format here doesn't work. If you don't know how to dispatch async actions look for redux-thunk or redux-saga. – Michael K. Sondej Jan 01 '18 at 10:23