React TypeScript子组件props隐式为any类型(ts7006)如何解决？

• 你未给GeneralButton函数的props参数显式绑定你定义的generalBtnPrpos接口类型，TypeScript 无法推导 props 类型，因此触发隐式any类型报错。
• 你将generalBtnPrpos写在函数名后的泛型尖括号中属于语法误用：这里的尖括号是用来声明动态泛型占位符的，和你上方定义的props接口没有关联，也不会给props参数绑定类型。
  额外提示：你定义的接口名generalBtnPrpos是拼写笔误，正确拼写为generalBtnProps，建议修正避免后续混淆。

方案1：直接给props参数加类型 #

删除函数名后的多余泛型尖括号，给props参数绑定你定义的接口类型即可：

// 仅修改函数定义行即可，其余代码保持不变
export default function GeneralButton(props: generalBtnPrpos) {
  const classes = useStyles();

  return (
    <Box className={classes.root}>
      <Button form={props.form} disabled={props.disabled} type={props.type} onClick={props.onClick} startIcon={props.icon} variant='contained' color='primary'>
        {props.text}
      </Button>
    </Box>
  );
}

方案2：使用React.FC规范写法 #

如果要符合React函数组件的标准写法，也可以通过React.FC的泛型绑定props类型：

const GeneralButton: React.FC<generalBtnPrpos> = (props) => {
  const classes = useStyles();

  return (
    <Box className={classes.root}>
      <Button form={props.form} disabled={props.disabled} type={props.type} onClick={props.onClick} startIcon={props.icon} variant='contained' color='primary'>
        {props.text}
      </Button>
    </Box>
  );
}
export default GeneralButton;

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