React Hook UseEffect create duplicate objects in setState

0
votes

I got a problem with a component. I make a n number calls to an external API and then get back values inside an object. I want to add each of this object return in the state. However, each object is duplicate in my state. I try to put conditions but nothing work. I just started with React and Node so I'm sorry if the solution is obvious...


    //Id for the API calls
    const Ref = ['268', '294']
 
    const nbreLiens = Ref.length
    
    //For each Id we make an API call, get the response, and set the state without erasing the previous value
    Ref.map(lien=>{

      const Tok = localStorage.getItem('token');

      Axios.get("http://localhost:3001/liens/sup/"+Tok+"/"+lien).then((Response) => {
        
        //We shouldn't get more entries that the number of Id's
        if (test.length<nbreLiens){
          setTest(test=>[...test,Response.data])
        }
      })
    })

  }, [])
reactjsaxiosuse-effect