Reactjs 未定义this.props.function名称

嘿，我正在创建一个redux应用程序，但是在我的一个组件中，我创建了一个方法，该方法正在访问其actioncreator方法，但是当访问它时，控制台会说它是this.props.selectBook不是一个函数。我不知道发生了什么，也不知道会发生什么

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

class BookList extends React.Component {
    renderList() {
        return this.props.books.map((book) => {
            return (
            <li onClick={() => this.props.selectBook(book)} key={book.title} 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
    };
}

function mapDispatchToProps(dispatch) {
    return bindActionCreators({selectBook: selectBook}, dispatch);
}

export default connect(mapStateToProps, mapDispatchToProps)(BookList);

---

代码的问题在于，在

操作/索引

文件中，您使用默认关键字导出了selectBook，这意味着在组件中，您必须按照此语法导入selectBook

从“../actions/index”导入selectBook

现在，您已经使用此语法导入了selectBook

从“../actions/index”导入{selectBook}

因此selectBook是未定义的

如果您想在文件中使用此语法，您必须像这样正常导出selectBook

export function selectBook (book) {
   return {
       type: 'BOOK_SELECTED',
       payload: book
   }
}

代码的问题在于，在
操作/索引
文件中，您使用默认关键字导出了selectBook，这意味着在组件中，您必须按照此语法导入selectBook

从“../actions/index”导入selectBook

现在，您已经使用此语法导入了selectBook

从“../actions/index”导入{selectBook}

因此selectBook是未定义的

如果您想在文件中使用此语法，您必须像这样正常导出selectBook

export function selectBook (book) {
   return {
       type: 'BOOK_SELECTED',
       payload: book
   }
}