axios returns "fullfilled" promise-CodePudding

Can someone please tell me why my Axios service function returns this:

The object looks fine in the service function.

Promise {<fulfilled>: {…}}
[[Prototype]]: Promise
[[PromiseState]]: "fulfilled"
[[PromiseResult]]: Object

Here is the call:

  useEffect(() => {
    setData(playlistService.getPlaylists);
  }, []);
  console.log(data);

And the function:

const config = {
  headers: {
    'Content-Type': 'application/json',
  },
  withCredentials: true,
};

const getPlaylists = async () => {
  try {
    const res = await axios.get(`${API_SONGS_URL}/`, config);
    console.log('RES ', res);
    return res;
  } catch (error) {
    if (error.response) {
      return error.response.data;
    }
  }
};

CodePudding user response：

this could work

useEffect(() => {
    const fetchPlayListAsync = async () => {
        const response = await playlistService.getPlaylists();
        setData(response)
    }
   fetchPlayListAsync()
}, []);

you can add appropriate checks of fetched data