title: why after delete in the list i must refresh the page manually?
body: <p>hi in my crud system delete action in working fine but when i press delete in front look like nothing happend. but i want when press remove as item remove in back remove immediately in front.</p>
  
  <p>i define one action with axios.delete.
  i have not a reducer because in toturial i watch he dont define a reducer for delete </p>
  
  <p>this is my code </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>//action
  export const REMOVE_BOOK = 'REMOVE_BOOK';
  export const removeBook = (id) =&gt; {
    const request = axios.delete(`${ROOT_URL}/${id}`);
    return {
      type: REMOVE_BOOK,
      payload: id
    }
  };
  
  
  //bookList component
  class BooksList extends Component {
    componentDidMount = () =&gt; {
      this.props.fetchBooks();
    };
    
    render() {
      if (!this.props.books) {
        return &lt;div&gt;Loading...&lt;/div&gt;
      }
      return (
        &lt;div&gt;
          &lt;Link to='create' className='btn btn-success'&gt; Create new Book&lt;/Link&gt;
          &lt;table className='table table-secondary table-hover'&gt;
            &lt;thead&gt;
            &lt;tr className='bg-info text-center'&gt;
              &lt;td&gt;remove&lt;/td&gt;
              &lt;td&gt;title&lt;/td&gt;
              &lt;td&gt;id&lt;/td&gt;
            &lt;/tr&gt;
            &lt;/thead&gt;
            &lt;tbody&gt;
            {this.props.books.map((book) =&gt; {
              return (
                &lt;tr key={book.id} className=' text-center'&gt;
                  &lt;td&gt;
                    &lt;button className='btn btn-danger'
                            onClick={() =&gt; {
                              this.props.removeBook(book.id);
                            }}
                    &gt;remove
                    &lt;/button&gt;
                  &lt;/td&gt;
                  &lt;td&gt;
                    &lt;Link to={`books/${book.id}`}&gt;{book.title}
                    &lt;/Link&gt;
                  &lt;/td&gt;
                  &lt;td&gt;{book.id}&lt;/td&gt;
                &lt;/tr&gt;
              )
            })}
            &lt;/tbody&gt;
          &lt;/table&gt;
  
        &lt;/div&gt;
      )
    }
  }
  
  const mapStateToProps = (state) =&gt; {
    console.log('state', state.books.all);
    return {books: state.books.all}
  };
  export default connect(mapStateToProps, {fetchBooks, removeBook})(BooksList);</code></pre>
  </div>
  </div>
  </p>