Uncaught TypeError: _this2.props.selectBook ist keine Funktion

Question

Ich bin ein Neuling für reactjs und folgte einem Grundkurs auf Udemy reagieren. Ich erhalte den folgenden Fehler in meinem Konsolenprotokoll. Kann mir jemand helfen?

bundle.js:21818 Uncaught TypeError: _this2.props.selectBook is not a function 

Jede Hilfe wäre willkommen. Vielen Dank.

Container/Buch-list.js

import React, { Component } from 'react'; 
import { connect } from 'react-redux'; 
import { selectBook } from '../actions/index'; 
import { bindActionCreators } from 'redux'; 

class BookList extends Component { 
    renderList() { 
     return this.props.books.map((book) => { 
      return (
       <li 
        key={book.title} 
        onClick={() => this.props.selectBook(book)} 
        className="list-group-item"> 
        {book.title} 
       </li> 
      ); 
     }); 
    } 

    render() { 
     return (
      <ul className="list-group col-sm-4"> 
       {this.renderList()} 
      </ul> 
     ) 
    } 
} 


function mapStateToProps(state) { 
    return { 
     books: state.books 
    }; 
} 

//Anythin returned from this function will end up as props 
// on the BookList container 
function mapDispatchToProps(dispatch) { 
    // whenever selectBook is called, the result should be passed 
    // to all of our reducers 
    return bindActionCreators({ selectBook: selectBook }, dispatch); 
} 

// Promote BookList from a component to a container - it needs to know 
// about this new dispatch method, selectBook. Make it available 
// as a prop. 
export default connect(mapStateToProps)(BookList); 

Aktionen/index.js

export function selectBook(book) { 
    console.log('A book has been selected:', book.title); 
} 

Komponenten/app.js

import React, { Component } from 'react'; 

import BookList from '../containers/book-list'; 

export default class App extends Component { 
    render() { 
    return (
     <div> 
     <BookList /> 
     </div> 
    ); 
    } 
} 

Answer 1

Ich habe die Antwort selbst gefunden.

// didnt have included the mapDispatchToProps function call in below lines. 
export default connect(mapStateToProps, mapDispatchToProps)(BookList); 

Answer 2

Verwenden import selectBook from '../actions/index' statt import { selectBook } from '../actions/index';

Answer 3

Stellen Sie sicher, selectBook Aktion zu exportieren, so dass sie innerhalb der Anwendung verfügbar ist

export function selectBook() {...}