typescript and onChange

[hovadick]

I try use onchange to get selected values

and I receive the follow error

Type 'Dispatch<SetStateAction<never[]>>' is not assignable to type '(newValue: unknown, actionMeta: ActionMeta<unknown>) => void'.
  Types of parameters 'value' and 'newValue' are incompatible.
    Type 'unknown' is not assignable to type 'SetStateAction<never[]>'.
      Type 'unknown' is not assignable to type '(prevState: never[]) => never[]'.  TS2322

    24 |         isMulti
    25 |         options={colourOptions}
  > 26 |         onChange={setSelectedOptions}
       |         ^
    27 |         // value={selectedOptions}
    28 |       />
    29 |       <Button onClick={handleClic}>teste</Button>

I imagine that I need create some types, but I need help.

[Methuselah96]

How is setSelectedOptions defined and what is the type definition of SetStateAction<never[]>?

[hovadick]

I copy a sample from sandbox (https://codesandbox.io/s/codesandboxer-example-forked-32yc8?file=/example.tsx:0-783)

thats my code
but i'm using typescript on my project

import React, { useState } from 'react';
import { Button } from 'react-bootstrap';

import Select from 'react-select';
import makeAnimated from 'react-select/animated';
import { colourOptions } from './docs/data';

const animatedComponents = makeAnimated();

export default function AnimatedMulti() {
  const [selectedOptions, setSelectedOptions] = useState([]);

  const handleClic = () => {
    console.log(selectedOptions);
  };

  return (
    <div>
      <Select
        closeMenuOnSelect={false}
        components={animatedComponents}
        defaultValue={[colourOptions[4], colourOptions[5]]}
        isMulti
        options={colourOptions}
        onChange={setSelectedOptions}
        // value={selectedOptions}
      />
      <Button onClick={handleClic}>teste</Button>
    </div>
  );
}

[Methuselah96]

The CodeSandbox you provided is using TypeScript and it doesn't have any type errors. I updated the CodeSandbox to set the type for useState which is what you might need to do to get your use case to work.

[hovadick]

Thanks.
I use your sample and understand.. thanks a lot.