reactjs - 类型 'Dispatch>' 不可分配给类型 '(values?: string) => void'

Question

我对 typecipt 很陌生，正在尝试制作一个基本的 pin 输入页面。 Sandbox link for my code .虽然它正在工作，但我在第 10 行收到了 onChange 函数的这个错误:

Type 'Dispatch<SetStateAction<any[]>>' is not assignable to type '(values?: string) => void'.Types of parameters 'value' and 'values' are incompatible.Type 'string' is not assignable to type 'SetStateAction<any[]>'.ts(2322)

我正在进口 react-hook-pin-input而且我在 ts 中找不到任何使用 onChange 的演示。请帮我重新编写 onChange，使 valueE 成为正在输入的值。可以在此处找到 react-hook-pin-input 的来源 - https://github.com/elevensky/react-hook-pin-input

Answer 1

请注意 onChange类型为 (values?: string) => void你路过setValueE类型为 React.Dispatch<React.SetStateAction<string[]>>这意味着 setValueE接受 string[]你通过了 string输入文字 onChange={setValueE} .
它只对你有用，因为你 init valueE使用字符串，然后将其更改为 string键入，为了让它按预期工作，请执行以下操作:

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>
  );
}