how to add params in useEffect axios get request

Backend code :

routes.get('/delivery/hotel/:hotelname',(req,res)=>{
const hotelName = req.params.hotelname;
res.json({'name': hotelName}) 
} )

routes.get('/delivery/hotel/:hotelname',(req,res)=>{
const hotelName = req.params.hotelname;
res.json({'name': hotelName}) 
} )

In reactjs , i don't know how to make that url cuz the hotelname could be different I tried like this

useEffect(()=> { 
async function fetchData(){ 
let res= await axios.get('http://localhost:1010/delivery/hotel/:hotelName')
console.log(res)
}
fetchData()
},[])

useEffect(()=> { 
async function fetchData(){ 
let res= await axios.get('http://localhost:1010/delivery/hotel/:hotelName')
console.log(res)
}
fetchData()
},[])

So idk how to set params in react axios ```

32 Replies

glutonium•3mo ago

u just put the name there in the link

axios.get("https://......./hotel/custonHotelName")

axios.get("https://......./hotel/custonHotelName")

vicOP•3mo ago

Yea , this is first time I use react with backend

glutonium•3mo ago

it's not anything with react it's just normal routing

vicOP•3mo ago

<Routes> <Route path='/delivery/hotel/:hotelName' element={component} > So I use useParams to get hotelName

glutonium•3mo ago

http://localhost:1010/delivery/hotel/customHotelName Open this url in your browser make sure your server is online it should return u "customHotelName" ooh u r also using react router

vicOP•3mo ago

Yep

glutonium•3mo ago

u have to fetch the route idk react router but ik that u have to first get the route from the url like the hotel nsme then you'll need to add that to the link

vicOP•3mo ago

I use like this const hotelName={useParams} and pass on fetch url with hotel name

glutonium•3mo ago

is it working! ? console log hotelName

vicOP•3mo ago

Yes it works But is it good practice?

glutonium•3mo ago

i don't know react router so can't really tell but if hotelName is holding the hotel name properly then u should he able to just do

axios.get(`https://......./hotel/${hotelName}`)

axios.get(`https://......./hotel/${hotelName}`)

vicOP•3mo ago

This is what I did

glutonium•3mo ago

here u r directly setting :hotelName in the param

vicOP•3mo ago

Yes that what I done

glutonium•3mo ago

that's not gon work this and this r diff do this

vicOP•3mo ago

I use let res= await axios.get(https://localhost:1010/deliver/hotel/${hotelName})

glutonium•3mo ago

hmm... and it is not working?

vicOP•3mo ago

It works

glutonium•3mo ago

weird

vicOP•3mo ago

But this is not working

glutonium•3mo ago

here it says deliver

vicOP•3mo ago

Type mistake

glutonium•3mo ago

on the server u have delivery ooh ok make sure u don't have those in your code

vicOP•3mo ago

glutonium•3mo ago

in what sense? does it give any error?

vicOP•3mo ago

It takes as a url and send no response Not as a params

glutonium•3mo ago

try console logging in the server console log hotelName before res.json see if it is receiving a response and make sure u have the url full like here i have skipped the middle part with ..... and no typo

vicOP•3mo ago

hotelName from router is working but U r message of http://localhost:1010/delivery/hotel/customHotelName Open this url in your browser make sure your server is online it should return u "customHotelName" This is not working

glutonium•3mo ago

it is not returning anything at all?

vicOP•3mo ago

Sorry for late , yes its not return anything

glutonium•3mo ago

np can u try this

vicOP•3mo ago

That works Works only from the react router useParams

Gaming

Programming

how to add params in useEffect axios get request