score:4
the issue is that given some query like "naruto", your current code results in the following text:
media(type:anime, search: naruto ) {
this is not valid syntax since string literals should be surrounded by double quotes ("
).
don't use string interpolation to provide dynamic values to the query. these should always be expressed as variables and included as a separate object inside your request alongside query
.
you need to define the variable as part of your operation, providing the appropriate type
var query = `query search ($searchquery: string!) {
then you can use the variable anywhere inside the operation:
media(type:anime, search: $searchquery) {
now just pass the variable value along with your request.
body: json.stringify({
query,
variables: {
searchquery,
}
})
note that the variable name is prefixed with a $
inside the graphql document, but outside of it, we don't do that.
score:0
media() looks like a function, so in that case the correct syntax would be:
media(type="anime", search=searchquery)
or if the argument of media() is an object
media({type: "anime", search: searchquery})
also, you don't need to use ${} around searchquery since searchquery is already a string. the usage for that would be something like
`${searchstring}` or `foo${searchstring}bar`
using the `` around the ${} utility to represent a string and its variable inside the string literal.
hope it helps!
Source: stackoverflow.com
Related Query
- Template literal - getting error from API
- i was trying to map data from api to some jsx element and i keep getting type error
- 'Access-Control-Allow-Origin' error when getting data from the API with Axios (React)
- Error Getting Data from API using FetchData
- Not getting data from api into the web page, can anyone help me through this where I am getting an error and what can i do to get data
- Getting the server error message from the fetch api when status is 500 not working
- Filter response from api on user search getting error :`Unhandled Rejection (TypeError): Cannot read property 'results' of undefined`
- Getting HttpCode 415 error of Unsupported media type from ASP.NET Core API endpoint
- Getting Error while mapping data from Geo ipify API in ReactJS
- Getting a type error when try to display data from API using react hooks
- ReactJS error getting object assigned from axios call to api
- GatsbyJS getting data from Restful API
- Getting Error from webpack-cli: "TypeError: merge is not a function" in webpack config
- Not getting results or error from stylelint / stylelint-config-styled-components
- React and Flux: "dispatch in the middle of a dispatch" to show error message from an API call
- How to find display error message from API in reactjs
- Getting error when try to use React Router v6: Attempted import error: 'Action' is not exported from 'history'
- React query mutation: getting the response from the server with onError callback when the API call fails
- React - Create tag dynamically from ES6 template literal with JSX
- React - this.state is null inside render when getting data from API
- React reading from firebase, getting error
- Flow error for prop string in template literal
- Getting 404 error while call oAuth2 api in the browser
- react-hook-form: how to show validaton message after getting response from api end point?
- How to set default value of react-select after getting data from API
- Getting referrence error while creating new array of object from existing array of objects?
- Getting an error while importing Loader from 'react-loader-spinner'?
- Why am I getting the error "'CSS3DObject' is not exported from 'three'"?
- 'AADSTS500011' error message returned from API call using adalFetch
- Getting undefined when trying to fetch data from an api - React
More Query from same tag
- How to pass ReactJS props properly?
- React show same list of items when browser back button is clicked
- How to precompile scss to a single css file in webpack?
- Difference between passing a ReactElement and a function that returns a ReactElement
- Can't access "props" from mapsDispatchToProps
- Creating a React Button Component, Importing it and adding Text to the Button
- react js and existing Laravel project
- How can I pass props to base component in styled-component?
- how can I show customized error messaged from server side validation in React Admin package?
- Javascript - async await vs promise callback
- How can I re-render MUI data table upon any user action in react
- How to manipulate fetch response for single object JSON in react-native
- With React, is it possible to have a propType to specify the DOM element type?
- getStaticPaths for dynamic route catching all routes [[...Id]].js in nextjs
- map function is not defined when calling products object in react redux
- Is good approach to combine Next.js with redux and apollo graphql?
- How to delete item from an array by onPress event in react
- How to fetch data that needs to be fetched only once
- Can not pass date to nivo line chart
- How to query native html elements when testing a React application with Jest?
- How can I use chart tooltip formatter in react-highcharts?
- How do you get rid of the console warning “Undefined” when using the React Data Grid
- Why is user data not storing into firebase firestore?
- Labelled arrow functions
- Warning: You should not use <Route component> and <Route render> in the same route; <Route render> will be ignored
- How to make parent's width wrap its content in React Native?
- How to fix this Syntax Error in my React App?
- Best practice to check that a component is not rendered
- How to pick color in consecutive manner using function in React?
- Invoked function from setTimeout shows incorrect React state