get data from an api and store it in a state, but the state still shows undefined-CodePudding

I want to get data from this api

export const searchSong = (songName) => {
axios.get(url)
  .then((data)=>{
    return (data.data.results);
  })
};

import searchSong in a component and run the function by passing a parameter and then store the data in a state variable like this

import { searchSong } from "../api";
    const songInput = async() => {
    setSongName(inputVar);
    let data = await searchSong(songName)
    setSearchedData(data);
  };

but it seems that this doesn't store the data in the state. What am i doing wrong?

I am a beginner to react, hope you will understand

CodePudding user response：

searchSong simply isn't returning anything. The call to axios.get is, but searchSong never returns that:

export const searchSong = (songName) => {
  return axios.get(url)
    .then((data) => {
      return (data.data.results);
    });
};

Which could be simplified to:

export const searchSong = (songName) => 
  axios.get(url).then(data => data.data.results);

(Which uses the implicit return of one-line arrow functions.)

Or:

export const searchSong = async (songName) => 
  (await axios.get(url)).data.results;