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•2mo ago

u just put the name there in the link

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

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

vic•2mo ago

Yea , this is first time I use react with backend

glutonium•2mo ago

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

vic•2mo ago

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

glutonium•2mo 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

vic•2mo ago

Yep

glutonium•2mo 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

vic•2mo ago

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

glutonium•2mo ago

is it working! ? console log hotelName

vic•2mo ago

Yes it works But is it good practice?

glutonium•2mo 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}`)

vic•2mo ago

This is what I did

glutonium•2mo ago

here u r directly setting :hotelName in the param

vic•2mo ago

Yes that what I done

glutonium•2mo ago

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

vic•2mo ago

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

glutonium•2mo ago

hmm... and it is not working?

vic•2mo ago

It works

glutonium•2mo ago

weird

vic•2mo ago

But this is not working

glutonium•2mo ago

here it says deliver

vic•2mo ago

Type mistake

glutonium•2mo ago

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

vic•2mo ago

glutonium•2mo ago

in what sense? does it give any error?

vic•2mo ago

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

glutonium•2mo 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

vic•2mo 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•2mo ago

it is not returning anything at all?

vic•2mo ago

Sorry for late , yes its not return anything

glutonium•2mo ago

np can u try this

vic•2mo ago

That works Works only from the react router useParams

Gaming

Programming

how to add params in useEffect axios get request