reactjs - Typen 'Dispatch>' kan inte tilldelas typen '(values?: string) => void'


Jag är väldigt ny på TypeScript och försöker skapa en grundläggande pin-inmatningssida. Sandbox-länk för min kod. Även om det fungerar, får jag detta fel för onChange-funktionen på rad 10:

Typen 'Dispatch>' kan inte tilldelas typen '(values?: string) => void'. Typerna för parametrarna 'value' och 'values' är inkompatibla. Typen 'string' kan inte tilldelas typen 'SetStateAction'.ts(2322)

Jag importerar react-hook-pin-input och jag kan inte hitta några exempel på hur man använder onChange i ts. Vänligen hjälp mig att skriva om onChange så att valueE blir värdet som anges. Källkoden för react-hook-pin-input finns här - https://github.com/elevensky/react-hook-pin-input

Svar #1

Observera att onChange är av typen (values?: string) => void och du skickar setValueE som är av typen React.Dispatch<React.SetStateAction<string[]>>, vilket betyder att setValueE accepterar string[] och du skickar en string-typ när du skriver onChange={setValueE}.

Det fungerar för dig bara av misstag, eftersom du initierar valueE med en sträng men sedan ändrar den till string-typ, för att det ska fungera som förväntat gör något liknande:

export default function App() {
  const [valueE, setValueE] = useState<string[]>([]);
  return (
    <div className="App">
      <h1>验证码</h1>
      <PinInput
        fields={4}
        values={valueE}
        onChange={(string) => setValueE([...string])}
      />
      <div> {valueE} </div>
    </div>
  );
}

Relaterade artiklar