如何修复：“TypeError: fetchProducts 不是函数”

Question

我正在尝试使用 redux 存储从 API 中检索一组产品。为了实现这一点，我创建了 actions 和 reducers，一个 functionmapStateToProps()和一个 function mapDispatchToProps()，后者包含一个 function fetchProducts()，它在动作文件中定义并且在调用时应该检索产品列表。所有这些都是通过以下方式完成的：这是概览组件，它应该渲染数据（实际渲染被省略了，因为它不影响这个问题）：import React, {Component} from 'react';import {connect} from 'react-redux';import PropTypes from 'prop-types'import fetchProductsAction from '../actions/ProductFetchingActionFile'import {bindActionCreators} from 'redux';export class Overview extends Component {    constructor(props) {        super(props);    }    componentDidMount() {        this.props.fetchProducts();    }    render() {        return(                  <h1>test</h1>        )    }}const mapStateToProps = state => ({    error: state.rootReducer.productsReducer.error,    products: state.rootReducer.productsReducer.products,    pending: state.rootReducer.productsReducer.pending,})const mapDispatchToProps = dispatch => bindActionCreators({    fetchProducts: fetchProductsAction }, dispatch)Overview.propTypes = {    fetchProducts: PropTypes.func}export default connect(mapStateToProps, mapDispatchToProps)(Overview);这是操作文件 (ProductFetchingActionFile)：import {    PREFIX,    FETCH_PRODUCTS_PENDING,    FETCH_PRODUCTS_SUCCESS,    FETCH_PRODUCTS_ERROR} from "./types";function fetchProductsPending() {    return{        type: FETCH_PRODUCTS_PENDING    }}function fetchProductsSuccess(products) {    return{        type: FETCH_PRODUCTS_SUCCESS,        products: products    }}function fetchProductsError(error) {    return{        type: FETCH_PRODUCTS_ERROR,        error: error    }}

Answer 1

试试这个

   const mapDispatchToProps = dispatch => {

       fetchProducts : () => {

            dispatch(fethcProducts())

         }

   }

Answer 2

您正在将您的操作导入为

import fetchProductsAction from '../actions/ProductFetchingActionFile'

当它看起来没有作为默认值导出时。

大概应该是：

import { fetchProductsAction } from '../actions/ProductFetchingActionFile'