Bruke e.target.value i TypeScript

Jeg er en Reactjs-utvikler og jeg lærer typescript, jeg gjør dette prosjektet med en film-API, så for at jeg skal kunne bygge søkefunksjonaliteten inn i nettsiden, trenger jeg e.target.value, men typescript gir meg feil som jeg ikke forstår. Så jeg vil legge ut koden min og takk på forhånd!

App.tsx

const [search, setSearch] = useState<iMovies['movie']>([])

const onChange = (e: React.ChangeEvent<HTMLInputElement>, value: any): void => {
e.preventDefault()
setSearch(e.target.value)
}

Deretter ville jeg hente API-en og bruke search tilstand/verdi for å legge den inn i API-en slik at appen vet hva den skal søke etter

dette er feilen

skriv inn bildetekst her

Svar #1

Jeg tror problemet ligger i en misforståelse av React.useState-hooken, og ikke nødvendigvis i din bruk av e.target.value i onChange-funksjonen.

React.useState holder typen til IMovies['movie'], som ser ut til å være

type IMovies['movie'] = Array<{
  id: number;
  original_title: string;
  overview: string;
  poster_path: string;
  background_path: string;
}>;

Du har et problem som om du prøvde å sette en integer-verdi inn i en variabel av typen string

const num: number = 'hello world!'; // ERROR: type string is not assignable to number

e.target.value er av typen string, og passer ikke til formen på din React.useState, som bruker typen beskrevet ovenfor.

Du bør enten endre React.useState til å holde en string-verdi i state for forespørselen din, eller du bør finne en måte inne i onChange-funksjonen din til å konvertere e.target.value til en type som samsvarer med din nåværende React.useState.