PropTypes — это встроенный механизм валидации в React, который проверяет, что пропсы компонента имеют правильные типы данных. В режиме разработки React автоматически валидирует пропсы и выводит предупреждения в консоль, если типы не совпадают. Эта валидация отключена в production для оптимизации производительности.
isRequired для обязательных пропсовReact предоставляет следующие встроенные типы валидации:
PropTypes.stringPropTypes.numberPropTypes.boolPropTypes.arrayPropTypes.objectPropTypes.funcPropTypes.nodePropTypes.elementPropTypes.symbolPropTypes.anyСначала установи библиотеку prop-types (обязательна начиная с React v15.5):
npm install prop-types
Классовый компонент:
import React from 'react'
import PropTypes from 'prop-types'
class User extends React.Component {
static propTypes = {
name: PropTypes.string.isRequired,
age: PropTypes.number.isRequired
}
render() {
return (
<>
<h1>Welcome, {this.props.name}</h1>
<h2>Age: {this.props.age}</h2>
</>
)
}
}
Функциональный компонент:
import React from 'react'
import PropTypes from 'prop-types'
function User({ name, age }) {
return (
<>
<h1>Welcome, {name}</h1>
<h2>Age: {age}</h2>
</>
)
}
User.propTypes = {
name: PropTypes.string.isRequired,
age: PropTypes.number.isRequired
}
PropTypes были перемещены из React.PropTypes в отдельную библиотеку prop-types в React v15.5. Всегда импортируй PropTypes напрямую из этой библиотеки.
Валидация PropTypes продолжает работать в production режиме, чтобы обеспечить целостность данных на протяжении всего жизненного цикла приложения.
Новый — ещё не проверен сообществом
Вы