기능적 상태 비 저장 구성 요소의 PropTypes

기능적 상태 비 저장 구성 요소의 PropTypes

---

클래스를 사용하지 않고 반응의 기능적 상태 비 저장 구성 요소에서 PropType을 어떻게 사용합니까?

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

---

공식 문서는 ES6 구성 요소 클래스와 함께이 작업을 수행하는 방법을 보여줍니다,하지만 같은 상태 비 기능적 구성 요소에 적용됩니다.

첫째, npm install/ 새로운 소품-종류의 패키지 당신이 이미하지 않은 경우.yarn add

그런 다음 상태 비 저장 기능 구성 요소를 정의한 후 내보내기 전에 propTypes (필요한 경우 defaultProps도 포함)를 추가합니다.

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;

---

Stateful과 다르지 않습니다. 다음과 같이 추가 할 수 있습니다.

import PropTypes from 'prop-types';
Header.propTypes = {
  title: PropTypes.string
}

다음은 prop-types npm에 대한 링크입니다.

참고 URL : https://stackoverflow.com/questions/44582209/proptypes-in-functional-stateless-component