Строка несовместима с числом (по умолчанию необязательное свойство ввода по умолчанию)

Question

С учетом следующего компонента псевдо-реакции:

type Props = {
  width?: number | string
};

const Component = ({
  width = '100%'
}: Props) => ( /* component body */ )

Поток выдает следующие ошибки:

6:   width = '100%'
     ^ string [1] is incompatible with number [2].
   References:
   2:   width?: number | string
                         ^ [1]
   2:   width?: number | string
                ^ [2]

6:   width = '100%'
             ^ string [1] is incompatible with number [2].
   References:
   6:   width = '100%'
                ^ [1]
   2:   width?: number | string
                ^ [2]

Компонент должен принимать 3 возможных типа для width: void | number | string.Есть ли правильный способ напечатать это?Я могу исправить ошибку, удалив значение по умолчанию '100%', но это решение менее идиоматично.

Answer 1

В потоке есть известная ошибка , которая приводит к сообщению об ошибке ошибочного типа, когда функция имеет аргумент по умолчанию для параметра, указанного как объединение.

Вы можете работатьвокруг это так:

const Component = ({ width }: Props) => ( /* component body */ )

Component.defaultProps = {
    width: '100%',
}