PropTypes reagieren: Erlaube verschiedene Arten von PropTypes für eine Requisite


244

Ich habe eine Komponente, die eine Requisite für ihre Größe erhält. Die Requisite kann entweder eine Zeichenfolge oder eine Zahl sein, z. B.: "LARGE"Oder 17.

Kann ich React.PropTypes wissen lassen, dass dies bei der propTypes-Validierung entweder der eine oder der andere sein kann?

Wenn ich den Typ nicht spezifiziere, erhalte ich eine Warnung: prop type `size` is invalid; it must be a function, usually from React.PropTypes.

MyComponent.propTypes = {
    size: React.PropTypes
}

Antworten:


572
size: PropTypes.oneOfType([
  PropTypes.string,
  PropTypes.number
]),

Weitere Informationen : Typprüfung mit PropTypes


Vielen Dank dafür, ich erhalte zufällige Fehler, wenn ich meine Scherztests durchführe und statische Proptypen in meinen Klassen einstelle: ReferenceError: oneOfType is not defined- Irgendwelche Vorschläge? Danke im Voraus!!
Sara Inés Calderón

Bist du sicher, dass du richtig importiert hast import PropTypes from 'prop-types';?
Paweł Andruszków

Hey, Pawel - ja, so importieren wir sie:import PropTypes from 'prop-types';
Sara Inés Calderón

1
2019 - Verwenden Sie PropTypes.oneOf
Imdad

26

Zu Dokumentationszwecken ist es besser, die zulässigen Zeichenfolgenwerte aufzulisten:

size: PropTypes.oneOfType([
    PropTypes.number,
    PropTypes.oneOf([ 'SMALL', 'LARGE' ]),
]),

11

Dies könnte für Sie funktionieren:

height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),

1
Während dieser Code die Frage möglicherweise beantwortet, verbessert die Bereitstellung eines zusätzlichen Kontexts darüber, warum und / oder wie dieser Code die Frage beantwortet, ihren langfristigen Wert.
Rollstuhlfahrer

-4
import React from 'react';              <--as normal
import PropTypes from 'prop-types';     <--add this as a second line

    App.propTypes = {
        monkey: PropTypes.string,           <--omit "React."
        cat: PropTypes.number.isRequired    <--omit "React."
    };

    Wrong:  React.PropTypes.string
    Right:  PropTypes.string

16
Ja, PropTypes lebt jetzt in einem eigenen Paket, aber das beantwortet die Frage nicht ...
Kevin Amiranoff

1
Völlig nicht relevant für die Frage
Jalooc
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.