title: How to fetch data by existing redux action with hooks?
body: <p>I'm trying to understand React Hooks. What I want is to fetch data inside functional component by call redux action with useEffect hooks. 
  I know that I can pass props to state like </p>
  
  <pre><code> const [todoList] = useState(props.todoList)
  </code></pre>
  
  <p>But what is the best practice to fetch data by existing redux actions?</p>
  
  <p>In React class component i call this method to fetch data in componentDidMount() and everythink works.</p>
  
  <pre><code>import React, { useEffect } from 'react'
  import { connect } from 'react-redux'
  import { ITodo } from './types'
  import { getTodos } from '../actions/todoActions'
  
  interface IProps {
      todoList: Array&lt;ITodo&gt;
  
      getTodos: typeof getTodos
  }
  
  
  const Todos = (props: IProps) =&gt; {
  
      useEffect(() =&gt; {
            props.getTodos()
      }, [props.todoList])
  
  
  
      return (
           &lt;div&gt;
               {props.todoList.map((_) =&gt; (&lt;div key={_.Id}&gt;{_.Name}&lt;/div&gt;))}
           &lt;/div&gt;
        )
   }
  
   const mapStateToProps = (state) =&gt; ({
       todoList: state.todo.todoList
   })
  
   const mapDispatchToProps = {
       getTodos
   }
  
  
    export default connect(mapStateToProps, mapDispatchToProps)(ProdRoute)
  </code></pre>
  
  <p>I expected to get list of todos with props and props.getTodos() should call once like in componentDidMount() method. But actualy I get data and getTodos() are called over and over again but should be called once on component mount</p>