TypeError: TypeError: (0, _reactRedux.useSelector) 不是函数答案

【问题标题】：TypeError: TypeError: (0, _reactRedux.useSelector) is not a functionTypeError: TypeError: (0, _reactRedux.useSelector) 不是函数
【发布时间】：2020-03-03 17:39:41
【问题描述】：

我正在我的 React Native 应用程序中处理 react-redux 中的 useSelector，我收到以下错误：

TypeError: TypeError: (0, _reactRedux.useSelector) is not a function.

我的代码是：

import { useSelector } from 'react-redux';

const availableMeals = useSelector(state => state.meals.filteredMeals);

根据官方文档，这是useSelector 的最简单用法，但我收到此错误。

以前，我在我的项目中遇到了另一个与 Redux 相关的错误，但它在一夜之间自动解决了，那么这个问题与某些缓存有关吗？

我该如何解决这个问题？

这是我的代码：

import React from 'react';
import { useSelector } from 'react-redux';

import { CATEGORIES } from '../data/dummy-data';
import MealList from '../components/MealList';

function CategoryMealScreen(props) {
    const catId = props.navigation.getParam('categoryId');

    const availableMeals = useSelector(state => state.meals.filteredMeals);

    const displayedMeals = availableMeals.filter(meal => meal.categoryIds.indexOf(catId) >= 0);

    return <MealList listData={displayedMeals} navigation={props.navigation} />;
};

CategoryMealScreen.navigationOptions = navigationData => {
    //console.log(navigationData);
    const catId = navigationData.navigation.getParam('categoryId');
    const selectedCategory = CATEGORIES.find(cat => cat.id === catId);

    return {
        headerTitle: selectedCategory.name,
    };
};

export default CategoryMealScreen;

【问题讨论】：

你能用 codepen 或一些实时编辑器发布你的代码吗？
确保你有 react-redux v7.1.0 或更高版本
@ShubhamKhatri 我的 react-redux 版本是 7.1.3，但错误仍然存在。
@MaulikSakhida 请检查：codepen.io/chetannik44/pen/LYYmLgR?editors=0010#0
是这样在你的路由减速器中定义的餐键吗？ const rootReducer = combineReducers({餐: ... });

标签： reactjs react-native react-redux

【解决方案1】：

如果您验证了 react >= 16.8.3 和 react-redux >= 7.1.1，请尝试以下解决方案。我的解决方法是安装 metro 软件包版本 0.56.0 。

通过 npm： npm install metro@0.56.0

通过纱线 yarn add metro@0.56.0

【讨论】：

【解决方案2】：

我在package.json 文件中将react-redux 版本从^5.1.1 升级到^7.1.1。

这导致我运行时出现上游依赖错误；

npm 安装

我通过在package.json 文件中将react 版本从16.8.0 升级到16.8.3 解决了这个问题。

之后，我能够安装这两个依赖项并停止收到下面的错误；

TypeError: TypeError: (0, _reactRedux.useSelector) is not a function

【讨论】：

react-redux 首先在 v7.1.0 上添加钩子，所以你应该更新你的 react-redux

【解决方案3】：

useSelector() 挂钩仅将函数作为输入，因此要解决您的问题，您必须创建一个函数来处理您的逻辑，然后在 useSelector 中调用它。这是一个例子：

这是一个 es6 函数

    const getMeals(state) => {
return state.meals.filteredMeals;
}

然后像这样将你的函数传递给 useSelector：

const availableMeals = useSelector(getMeals(myState));

你可以把这个函数（getMeals）放在你的当前组件中，甚至把它放在你的reducer中。

【讨论】：

state => state.meals.filteredMeals 已经是一个函数了。
@Tolokoban state.meals.filteredMeals 看起来像存储在状态中的单个值。