title: React Typescript: Property 'match' is missing in type {}. (Trying to use properties in component initialisation)
body: <p>Currently trying to get to grips with how to send properties when creating components.</p>
  
  <p>I have a <code>LoginButton</code> component which I want to initialise with 'user' and 'avatarImg' props, like so:</p>
  
  <pre><code>interface LoginButtonState {
      userLoggedIn: boolean,
      user: Account,
      avatarImg: AccountImage,
  }
  
  export class LoginButton extends React.Component&lt;RouteComponentProps&lt;{}&gt;, LoginButtonState&gt; {
  
      constructor(props) {
  
          super(props);
  
          this.state = {
              userLoggedIn: false,
              user: this.props.match.params["user"], // &lt;---- Initialised here
              avatarImg: this.props.match.params["avatarImg"], // &lt;-- and here
              modalOpen: false
          }
  
      }
  
  //... functions, render(), etc,
  
  }
  </code></pre>
  
  <p>Looking at various explanations online, I'm led to believe I should then create the <code>&lt;LoginButton/&gt;</code> component like so:</p>
  
  <pre><code>import { LoginButton } from './widgets/loginButton';
  import { Account, AccountImage } from './DatabaseClasses';
  
  export class Layout extends React.Component&lt;LayoutProps, {}&gt; {
  
      public render() {
  
      let testUser = new Account();
      let testImg = new AccountImage();
  
      return (
          &lt;div id="outer-container"&gt;
  
              &lt;LoginButton user={testUser} avatarImg={testImg}&gt;&lt;/LoginButton&gt;
  
          &lt;/div&gt;
      );}
  }
  </code></pre>
  
  <p>But this gives me an error:</p>
  
  <blockquote>
    <p>Error TS2322  (TS) Type '{ user: Account; avatarImg: AccountImage; }' is not assignable to type 'Readonly>'.
      Property 'match' is missing in type '{ user: Account; avatarImg: AccountImage; }'.    </p>
  </blockquote>
  
  <p>I can see what the error is telling me, and I'm pretty sure the <code>TS</code> part means it's a Typescript thing, but I have idea how to go about fixing it..!</p>
  
  <p>The only thing I've tried which made sense was to use the <code>any</code> type in the first part, forming <code>export class LoginButton extends React.Component&lt;RouteComponentProps&lt;any&gt;</code>, but the problem stays pretty much the same. The error becomes:</p>
  
  <blockquote>
    <p>Error TS2322  (TS) Type '{ user: Account; avatarImg: AccountImage; }' is not assignable to type 'Readonly>'.
      Property 'match' is missing in type '{ user: Account; avatarImg: AccountImage; }'.</p>
  </blockquote>
  
  <p>Any pointers much appreciated, thanks.</p>