我对反应中的打字稿感到困惑

Question

我是打字稿初学者，以下方法对于打字稿正确吗？

我的父组件

interface MailDetailsProps {
  mailId?: string;
}

interface MailPopup {
  open?: boolean;
  width?: string;
  icon?: React.ReactNode;
  title?: string;
}

const MailDetails: React.FC<MailDetailsProps> = ({ mailId }) => {
  const { t } = useTranslation();
  const dispatch = useDispatch();

  const [mailPopup, setMailPopup] = useState<MailPopup>({});

  return (
    <>
      <MailDetailsPopup mailPopup={mailPopup} setMailPopup={setMailPopup} />
    </>
  );
};

MailDetails.propTypes = {
  mailId: PropTypes.string
};

export default MailDetails;

我的子组件

interface MailDetailsPopupProps {
  mailPopup: any;
  setMailPopup: React.Dispatch<React.SetStateAction<any>>;
}

const MailDetailsPopup: React.FC<MailDetailsPopupProps> = ({ mailPopup, setMailPopup }) => {
  const { t } = useTranslation();
  const [emailOpen, setEmailOpen] = useState(false);

  return (
  
  );
};

export default MailDetailsPopup;

我不确定定义

mailPopup: any

。因为我已经在我的父组件中定义了。

Answer 1

第一： 不要在界面中使用...more。

第二： 您已将 mailPopup 声明为任何子组件，那么您期望什么？ 导出接口并正确输入。