React注册页面报错：Line 18:19 'value' props未校验

报错Line 18:19:'value' is missing in props validation是ESLint的react/prop-types规则触发的，该规则要求组件接收的props必须明确定义类型验证。你的Choice组件接收了value属性但未做验证，因此出现这个提示。

解决方法 #

方法1：使用PropTypes定义props验证（推荐）

1. 若项目未安装prop-types包，先执行安装：

   npm install prop-types
   # 或
   yarn add prop-types
   

2. 在组件文件中导入PropTypes，并给Choice组件添加propTypes规则：

   import PropTypes from 'prop-types';
   
   const Choice = ({ value }) => {
     if (value === "true"){
       return <Employee />
     }else{
       return <Employer />
     }
   };
   
   // 定义props验证规则
   Choice.propTypes = {
     value: PropTypes.string.isRequired, // value为必填的字符串类型
   };
   

方法2：使用TypeScript定义props类型（TS项目适用）

如果项目基于TypeScript，直接给props定义接口类型即可：

interface ChoiceProps {
  value: string;
}

const Choice = ({ value }: ChoiceProps) => {
  if (value === "true"){
    return <Employee />
  }else{
    return <Employer />
  }
};

方法3：临时关闭ESLint规则（不推荐长期使用）

若只是临时跳过验证，可在Choice组件上方添加注释关闭该规则：

// eslint-disable-next-line react/prop-types
const Choice = ({ value }) => {
  // ...组件逻辑
};

内容的提问来源于stack exchange，提问作者user19069531