当try 运行我的Reaction应用程序时,我在浏览器控制台中收到以下错误:未捕获TypeError:useSelector不是一个函数.代码在VS Code上编译得很好.

下面是导致问题的App.js代码:

const BrowserRouter = require('react-router-dom');
const Navigate = require('react-router-dom');
const Routes = require ('react-router-dom');
const Route = require ('react-router-dom');
const HomePage = require ('scenes/homePage');
const LoginPage = require ('scenes/loginPage');
const ProfilePage = require ('scenes/ProfilePage');
const useMemo = require ('react');
const useSelector = require ('react-redux');
const CssBaseline = require ('@mui/material');
const ThemeProvider = require ('@mui/material');
const createTheme = require ('@mui/material/styles');
const themeSettings = require ('./theme');


function App() {
  const mode = useSelector((state) => state.mode);
  const theme = useMemo(() => createTheme(themeSettings(mode)), [mode]);
  const isAuth = Boolean(useSelector((state) => state.token));

  return (
    <div className="app">
      <BrowserRouter>
        <ThemeProvider theme={theme}>
          <CssBaseline />
          <Routes>
            <Route path="/" element={<LoginPage />} />
            <Route
              path="/home"
              element={isAuth ? <HomePage /> : <Navigate to="/" />}
            />
            <Route
              path="/profile/:userId"
              element={isAuth ? <ProfilePage /> : <Navigate to="/" />}
            />
          </Routes>
        </ThemeProvider>
      </BrowserRouter>
    </div>
  );
}

export default App;

任何帮助都将不胜感激.谢谢

我首先看了一下之前的帖子,并try 了以下几种方法:

  • 我仔细判断了一下,使用:const useSelector=Required(‘action-redux’)正确地导入了useSelector;
  • 我还判断了我的Reaction-Redux是最新版本.
  • 我还判断了Reaction-Redux文档,以确保语法正确,似乎不是语法错误

推荐答案

useSelector不是react-redux的默认导出,它是命名导出.

const { useSelector } = require('react-redux');

或者,您可能需要使用:

const ReactRedux = require('react-redux');
...
ReactRedux.useSelector((state) => state.token);

或者只使用常规导入

import { useSelector } from 'react-redux';

Reactjs相关问答推荐

如何在react组件中使用formik进行验证

在Reaction+Redux+RTKQuery中对API调用进行排序

根据另一个Select中的选定值更改Select中的值

获取点击的国家/地区名称react 映射

获取未捕获的错误:Gatsby生产版本上的最小化react 错误#418

React:关于useEffect钩子如何工作的困惑

Redux工具包-useSelector如何通过Reducer引用InitialState?

在数组对象内的数组上进行映射

获取更改后的状态值

无法找出状态正在被更改的位置

如何使用TouchStart/TouchEnd在Table ReactJS中交换位置?

如何使用 App Router 和服务器组件在 Next.js 13 中实现分页

React useContext 的未定义返回值

使用jest如何覆盖对象的模拟?我正在使用`jest.mock()`来模拟对象,并希望 for each 测试用例覆盖模拟.

在react 中单击父级中的按钮时如何将数据从子级发送到父级?

onChange in useEffect 的最佳实践

如何保留我的下一个授权用户会话?所以我可以使用提供的 ID 在其他路由中获取数据

antd 找不到 comments

如何禁用来自 React Native API 的某些特定项目的可touch 不透明度

如何使用react 路由将 url 参数限制为一组特定的值?