title: Map typescript parameter: Binding element 'contacts' implicitly has an 'any' type.ts
body: <p>I have this code taken from a JavaScript post and I would like to use it in typescript but I get an error in: <code>const Contacts = ({contacts}) =&gt; {</code></p>
  
  <p>I tried <code>{contacts: []}</code> without success.
  Contacts is located in App states.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, { Component }  from 'react';
  import './App.css';
  import Contacts from './components/contacts';
  
  class App extends Component {
  
    state = {
      contacts: []
    }
    componentDidMount() {
      fetch('http://jsonplaceholder.typicode.com/users')
      .then(res =&gt; res.json())
      .then((data) =&gt; {
        this.setState({ contacts: data })
      })
      .catch(console.log)
    }
    render() {
      return (
        &lt;Contacts contacts={this.state.contacts} /&gt;
      )
    }
  }
  export default App;
  
  
  ***contact.tsx ***
  import React from 'react'
      
      const Contacts = ({contacts}) =&gt; {Binding element 'contacts' implicitly has an 'any' type.ts(7031)
        return (
          &lt;div&gt;
            &lt;h1&gt;Contact List&lt;/h1&gt;
            {contacts.map((contact: any) =&gt; (
              &lt;div&gt;
                &lt;div&gt;
                  &lt;h5&gt;{contact.name}&lt;/h5&gt;
                  &lt;h6&gt;{contact.email}&lt;/h6&gt;
                  &lt;p&gt;{contact.company.catchPhrase}&lt;/p&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            ))}
          &lt;/div&gt;
        )
      };
  
      export default Contacts</code></pre>
  </div>
  </div>
  </p>
  
  <p>I get the error:</p>
  
  <blockquote>
    <p>Binding element 'contacts' implicitly has an 'any' type.ts(7031)</p>
  </blockquote>