object parameters type definition in typescript

Question

I am passing a component some props. One of this is a function that doesn't return anything. I have to pass two an object as parameter comosed by two booleans. How do I specify that those parameters are booleans?

const MyComponent: React.FC<{
  onChange: ({ isFoo1, isFoo2 }) => void;
}> = ({ onChange }) => {
    const [isFoo1, setIsFoo1] = useState<boolean>(false);
    const [isFoo2, setIsFoo2] = useState<boolean>(false);
  
    /*
    * stuff...
    */

    useEffect({
      onChange({isFoo1, isFoo2})// <----- Type error
    },[isFoo1, isFoo2])
}

The typerror has code 2345 and it appears because on onChange definition I haven't specified the type of the two parameters.. How can I do that?

@AlekseyL. That's a syntax error; you can't type parameters with destructuring syntax. (well not a syntax error but it doesn't do what you think it does) — Aplet123
– Aplet123, Commented Nov 7, 2021 at 13:26

Aplet123 · Accepted Answer · 2021-11-07 13:26:21Z

4

Don't use destructuring in the type of the onChange function. Instead, just use a normal object parameter and type it as you would an object:

onChange: (obj: {isFoo1: boolean, isFoo2: boolean}) => void;

Playground link

answered Nov 7, 2021 at 13:26

Aplet123

35.8k1 gold badge41 silver badges66 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

object parameters type definition in typescript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related