CODEWITHSUNDEEP
javascriptreactjs
user13604452
user13604452

Reputation:

Fetch request method Get.. How i can get response with query params?

  fetchArea = (e) => {
this.setState(({ area }) => ({ area: e.target.value }));
console.log(new URLSearchParams({ input: this.state.area }).toString());
fetch(
  `https://xegr-geography.herokuapp.com/places/autocomplete?` +
    new URLSearchParams({ input: this.state.area }).toString(),
  {
    method: "GET",
    mode: "no-cors",
    headers: { "Content-Type": "application/json" },
    params: { input: this.state.area },
  }
)
  .then((res) => res.json())
  .then((data) => this.setState({ data: data }))
  .catch((err) => console.log(err));

};

i am taking back "SyntaxError: Unexpected end of input" ! im trying to access this endpoint and search with an input type of 3 characters.

Upvotes: 0

Views: 4116

Answers (1)

Jay Pillai
Jay Pillai

Reputation: 178

Not enough reputation to add a comment, but, what does the console.log output? I don't expect it to have the updated state value in it because setState doesn't happen instantly. It's batched in react. So, if you call it where you're calling it, you will not get the expected value of this.state.area in the below line.

new URLSearchParams({ input: this.state.area }).toString(),

Instead of the above, try this,

new URLSearchParams({ input: e.target.value }).toString(),

Upvotes: 3

Related Questions