Reagieren Zusammensetzung Komponente ProTypes

Question

Ich benutze die Zusammensetzung Muster für reagieren. So zum Beispiel, ich habe diese einfache Komponente:

class Simple extends React.Component { 
    render() { 
    return <div>{this.props.text}</div>; 
    } 
} 

Simple.propTypes = { 
    text: React.PropTypes.string.isRequired 
}; 

Jetzt habe ich diese erweiterte Komponente:

class Enhanced extends React.Component { 
    render() { 
    return (
     <div> 
     <div>Hi, I'm the enhanced version</div> 
     <Simple {...this.props} /> 
     </div> 
    ); 
    } 
} 

Nun, wie kann ich die proptypes für die erweiterte Komponente angeben? Ich kann dies tun:

Enhanced.propTypes = { 
    text: React.PropTypes.string.isRequired 
}; 

aber das ist nicht gut, weil ich all die Requisiten von Simple Komponentenliste haben werde und zu jeder Zeit ich diese Requisiten zu ändern, werde ich sie in Enhanced ändern muß

Answer 1

propTypes sind nur normale JS-Objekte. Sie können sie komponieren, wie Sie wollen:

// Simple.js 
export const simplePropTypes = { 
    text: React.PropTypes.string.isRequired 
} 

Simple.propTypes = simplePropTypes 

// Enhanced.js 
import Simple, { simplePropTypes } from './Simple' 

Enhanced.propTypes = { 
    somethingElse: React.PropTypes.number, 
    ...simplePropTypes 
} 

Update:

Sie sollte Lage sein propTypes direkt die Komponente Definition zu verwenden.

Enhanced.propTypes = { 
    somethingElse: React.PropTypes.number, 
    ...Simple.propTypes 
}