如何禁止在PrimeReact的InputText输入框中输入数字

你遇到的核心问题是：type="text"的输入框无论输入什么内容，拿到的都是字符串类型，所以typeof ... === 'number'这个判断永远不会触发。下面给你两种直接可行的解决思路：

1. 从输入源头过滤数字（推荐） #

修改你的handleChange函数，在更新值之前把所有数字字符过滤掉，用户输入数字时直接不会显示在输入框里：

const handleChange = (e) => {
  // 用正则替换掉所有0-9的数字
  const cleanValue = e.target.value.replace(/[0-9]/g, '');
  // 根据你的表单库（比如Formik）或状态管理方式更新值，示例用Formik的setFieldValue
  setFieldValue(e.target.name, cleanValue);
};

同时给输入框加onKeyDown事件，阻止数字键输入，提升交互体验：

<FloatingLabel text="Name" name={`luxmeds.${index}.persons.${idx}.name`}>
  <StyledInputText
    name={`luxmeds.${index}.persons.${idx}.name`}
    value={person.name}
    onChange={handleChange}
    type="text"
    onKeyDown={(e) => {
      // 阻止主键盘和小键盘的数字键输入
      const isNumberKey = /[0-9]/.test(e.key) || (e.keyCode >= 96 && e.keyCode <= 105);
      if (isNumberKey) e.preventDefault();
    }}
  />
</FloatingLabel>

2. 校验已有内容并提示 #

如果需要保留用户输入的数字但给出警告，把原来的类型判断换成正则校验，检查字符串中是否包含数字：

{!values.luxmeds[index].persons[idx].name && (
  <StyledWarningText>请填写名称</StyledWarningText>
)}
{values.luxmeds[index].persons[idx].name?.match(/[0-9]/) && (
  <StyledWarningText>名称不能包含数字</StyledWarningText>
)}

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