Fonksiyonel durum bilgisi olmayan bileşende PropTypes

Question

Sınıf kullanmadan, PropTypes'i reaksiyonun işlevsel durumdaki bileşeninde nasıl kullanırım? Bu durum bilgisi ile farklı değildir

export const Header = (props) => (
    <div>hi</div> 
) 

Answer 1

, Sen gibi ekleyebilirsiniz:

Header.propTypes = { 
    title: React.PropTypes.string 
} 

Answer 2

official docs ES6 bileşen sınıfları ile bunu nasıl gösterir, ancak aynı vatansız fonksiyonel bileşenler için de geçerlidir.

Öncelikle, henüz yüklemediyseniz npm install/yarn new prop-types package'u ekleyin. Sonra, vatansız işlev bileşeni tanımlandıktan sonra, dışa aktarmadan önce propTyp'larınızı (ve gerekiyorsa varsayılanlarıProp) da ekleyin.

import React from "react"; 
import PropTypes from "prop-types"; 

const Header = ({ name }) => <div>hi {name}</div>; 

Header.propTypes = { 
    name: PropTypes.string 
}; 

// Same approach for defaultProps too 
Header.defaultProps = { 
    name: "Alan" 
}; 

export default Header