React中类型'IntrinsicAttributes＆InterfaceProps'上不存在属性'x'

Question

我正在寻找我得到错误的答案

Property 'initialError' does not exist on type 'IntrinsicAttributes & InterfaceProps'.ts(2322)

在父组件中。 prop的{​​{1}}值被向下传递给子组件，而初始值为initialError

null

然后在子组件中

interface InterfaceState {
  error: any;
}

class Parent extends Component<InterfaceState> {
  private static INITIAL_STATE = {
    error: null
  };

  public constructor(props) {
    super(props);
    this.state = { ...VerifyEmail.INITIAL_STATE };
  }

  public render() {
    const { error } = this.state;

    let component;
    if (error === null) {
      component = <span>Loading</span>;
    } else if (error !== null) {
      component = <ChildComponent initialError={error} />;
    }

    return component;
  }
}

我已经查看了有关此错误的其他问题，但都没有解决interface InterfaceProps { initialError: any; } class ChildComponent extends Component<InterfaceProps> { public render() { const { initialError } = this.props; return ( <Errors error={initialError} /> ); } } 上不存在initalError的原因。

我缺少明显的东西吗？

注意：如果InterfaceProps中出现error，则componentDidMount的值将在error中更新。我从上面的代码中删除了代码，因为我没有发现任何原因。

完整参考原始代码，而不是上面的示例。父组件是

promise

而子组件是

import React, { Component } from 'react';

import VerifyEmailValid from './valid';
import VerifyEmailError from './error';

interface InterfaceProps {
  firebase?: any;
  oobCode?: string;
}

interface InterfaceState {
  validCode: boolean;
  verifiedCode: boolean;
  error: any;
}

class VerifyEmail extends Component<InterfaceProps, InterfaceState> {
  private static INITIAL_STATE = {
    validCode: false,
    verifiedCode: false,
    error: null
  };

  public constructor(props: InterfaceProps) {
    super(props);
    this.state = { ...VerifyEmail.INITIAL_STATE };
  }

  public componentDidMount() {
    this.VerifyEmail();
  }

  public componentDidUpdate(prevProps: any) {
    const { firebase: prevFirebase } = prevProps;
    const { firebase } = this.props;
    if (!prevFirebase && firebase) {
      this.VerifyEmail();
    }
  }

  public VerifyEmail = () => {
    const { firebase, oobCode } = this.props;
    if (firebase !== null) {
      firebase.doActionHandler(oobCode).then(
        () => {
          this.setState({ validCode: true, verifiedCode: true });
        },
        (error: any) => {
          this.setState({
            error: error,
            validCode: false,
            verifiedCode: true
          });
        }
      );
    }
  };

  public render() {
    const { firebase } = this.props;
    const { error, validCode, verifiedCode } = this.state;

    let component;
    if (!verifiedCode) {
      component = <span>Loading</span>;
    } else if (verifiedCode && validCode) {
      component = <VerifyEmailValid />;
    } else if (verifiedCode && !validCode) {
      component = <VerifyEmailError initialError={error} firebase={firebase} />;
    }

    return component;
  }
}

export default VerifyEmail;