MicLostek
MicLostek

Reputation: 7

react/typescript: Parameter 'props' implicitly has an 'any' type. After Using IProps interface

I don't understand why I have this type of error

Parameter 'props' implicitly has an 'any' type.

Because I using iterface before to used props in constructor method. Below I put whole react component when I have the problem

import { connect } from 'react-redux';
import { FetchPokemon } from '../../actions';

import * as React from 'react';
import { HeaderComponent } from './HeaderComponent';

import {IStoreState} from '../../types';

interface IProps {
  pokemon: object[];
  FetchPokemon: () => void;
}
interface IState {
  example: boolean
}

class HeaderContainer extends React.Component<IProps, IState> {
  constructor(props) {
    super(props);

    this.state = {
      example: false
    }

    this.FetchAction = this.FetchAction.bind(this);
  }

  public FetchAction = () => {
    this.props.FetchPokemon()
  }

  public render() {
    return (
      <div>
        {console.log(this.props)}
        <HeaderComponent fetchAction={this.FetchAction}/>
      </div>
    )
  }
}

const mapStateToProps = (state: IStoreState) => ({
  pokemon: state.fetchPokemon
})

export default connect(mapStateToProps, {FetchPokemon})(HeaderContainer) as any;

Do anyone have some idea ?

Upvotes: 0

Views: 1539

Answers (1)

Christian Ivicevic
Christian Ivicevic

Reputation: 10905

The strict nature of TypeScript requires you to be clear about certain types and object, depending on your transpiler configuration. When it comes to React and TypeScript it is suggested to write the constructor as follows:

class Component extends React.Component<Props, State> {
    public constructor(props: Props) {
        super(props as any);
    }
}

Upvotes: 1

Related Questions