Каково правильное значение для `defaultProp`, которое соответствует` PropTypes.element`? - PullRequest
Новая
       19

Каково правильное значение для `defaultProp`, которое соответствует` PropTypes.element`?

1 голос
/ 22 мая 2019

У меня есть компонент, который я хочу принять другой компонент в качестве реквизита, и сделать это. Я хочу, чтобы этот переданный компонент был необязательным, и в этом случае ничего не отрисовывалось.

Следующий код отлично работает: 

const Component = ({ Inner }) => (
  <div style={{ borderStyle: "solid" }}>
    <Inner />
  </div>
);

Component.propTypes = {
  Inner: PropTypes.element
};

Component.defaultProps = {
  Inner: () => null
};

Однако при первой загрузке страницы prop-types жалуется:

Предупреждение: сбойный тип пропеллера: недопустимая опора Inner типа function, предоставленная Component, ожидается один ReactElement.

Мое текущее решение состоит в том, чтобы переопределить propType как PropTypes.oneOfType([PropTypes.element, PropTypes.func]), но это кажется совершенно неправильным.

Каким должен быть мой propType или defaultProp на самом деле?

SSCCE в песочнице .

Этот вопрос похож на Если тип элемента по умолчанию? , но он принял ответ, который не работает, и даже если он это сделал, это не очень поможет Я, как я использую реагировать родной по-настоящему. Я не сформулировал вопрос таким образом, чтобы реагировать на ту или иную натуру, как я уже сказал, мой пример работает , просто prop-types - большой злодей.

1 Ответ

2 голосов
/ 23 мая 2019

Использование типа elementType решит вашу проблему. 

Component.propTypes = {
  Inner: PropTypes.elementType
};

Поскольку ваша опора является компонентом реакции, поэтому мы используем elementType. Если вы когда-нибудь откроете исходный код для типов поддержки, вы найдете его там.

enter image description here

Надеюсь, что это полезно для вас.

...