在带有flowtype的React中，我如何只键入某些道具并允许其他任何道具

Question

I'm making an input in form and want to type certain props for my input component but allow any others through without typing them - like all the attributes for an input field.

Do I really need to create a type for all of them?

Answer 1

Flow supports subtype polymorphism. So if you define a type like this

type Foo = {
  a: number,
  b: string,
}

Any object that has at least those fields, will be a valid Foo :

let foo: Foo = { 
    a: 0,
    b: "hello",
    c: false // this is ok
}

However, if you actually need to access those fields then you should make them part of the type.

Answer 2

You can define an intersection type of custom props + any input props:

type Props = {
  foo: string,
  bar: number,
} & $Shape<HTMLInputElement>

$Shape used above:

Copies the shape of the type supplied, but marks every field optional.