Что значит ошибка при работе с react redux?

Question

[sxivanov]

Всем привет! Хотел попробовать redux после теоретического обучения и чет не выходит.

Создаю store

import { createStore } from "redux"
import { myReducer } from "./myReducer";
import { compose } from "redux";

const store = createStore(myReducer, compose(window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()));

export default store;

Создаю reducer

const defaultState = {
    rabby: 1
} 
export const ACTION_ONE = "ACTION_ONE"
export const ACTION_TWO = "ACTION_TWO"

export const myReducer = function (state = defaultState, action) {
    switch (action.type) {
        case ACTION_ONE: return {...state, rabby: state.rabby + action.payload};
        case ACTION_TWO: return {...state, rabby: state.rabby - action.payload};
        default: return state;
    }
};

Заворачиваю в Provider

import React from "react";
import ReactDOM from "react-dom";
import store from './store/store';
import App from "./App";
import { Provider } from "react-redux";

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,
  document.getElementById("root")

Получаю ошибку

Comments

[GlazOtca]

В представленных кусочках кода - ошибок не вижу. Попробуйте для начала убрать из реакта React.StrictMode, возможно используете что-то устаревшее в коде. Если не поможет выкладывайте на codepen.io, будем разбираться.

[Антон Горецкий]

В сообщении об ошибках написано, что вы неправильно используете хуки. Но я не вижу в вашем коде хуков - ищите ошибку в месте использования хуков.

[Александр]

Что в App.js?

[sxivanov]

Александр,

import React from "react";

function App() {
  return (
    <div className="App">
      
    </div>
  );
}

export default App;

[sxivanov]

GlazOtca, убрал, не помогло. Голый код выложить на codepen? Не выкладывал реакта так еще

[Александр]

Руслан Иванов, попробуйте

createStore(myReducer, undefined, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__());

[Александр]

Руслан Иванов, Такой лучше на CodeSandbox вместо CodePen.

[GlazOtca]

А что выкладывать? Я так понял у вас "пусто" в App.js, а больше ничего и нету. Попробуйте, как-то реализовать логику внутри App, что то диспатчить, вызывать методы.

[Alexandroppolus]

во всем приложении нет ни одного вызова хука.
это точно тот самый код, который запускается?

[Kataev]

GlazOtca, а какая разница, пуст компонент или нет? Ошибка от этого никуда не денется.

Руслан Иванов,
Вот тут

import React from "react";
import ReactDOM from "react-dom";
import store from './store/store';
import App from "./App";
import { Provider } from "react-redux";

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,
  document.getElementById("root")

Как минимум, не хватает закрывающейся скобки

[sxivanov]

Александр, https://codesandbox.io/s/react-redux-forked-tju19n...

Выложил и полетела куча ошибок.
Кстати, он сам создает реакт+редакс скелет рабочий и понятный, буду дома посмотрю в чем дело в моих ошибках и потыкаю предложенный скелет сервисом

Спасибо, частично Вы мне уже помогли)

[sxivanov]

Alexandroppolus, да, логику не создавал еще. Там было 2 кнопки которые увеличивают и уменьшают число. Типичная минипрограммка, что бы понять как что и откуда берет redux. То, что я ее вырезал, никак не влияет на проблему.

[sxivanov]

Kataev, она есть, сюда не вставил

[Alexandroppolus]

Руслан Иванов,

Там было 2 кнопки которые увеличивают и уменьшают число. Типичная минипрограммка, что бы понять как что и откуда берет redux.

рискну предположить, что в обработчиках onClick для этих кнопок вызывался useDispatch

[sxivanov]

Alexandroppolus, еще не вызывался. Не дошел до него, программа упала раньше)

Answer 1

[profesor08]

Ты вызвал хук не из компонента. Так делать не надо, о чем и написано в ошибке.

Comments

[sxivanov]

Какой именно хук в моем коде?

[profesor08]

Руслан Иванов, в представленном коде его нет. Ищи некую функцию, которую ты где-то объявил и в которой вызвал хук. И посмотри где она вызывается, если не из компонента, то значит это она самая.

[profesor08]

Руслан Иванов, Так-же в ошибке у тебя отображен список вызовов и там светится хук useMemo, смотри где ты его вызываешь и исправляй.

[sxivanov]

profesor08, прикол в том, что это вся программа. App пустой. Либо в том, что мне нужно подтянуть react))

[profesor08]

Руслан Иванов, значит неправильно создаешь store

[sxivanov]

profesor08, "как по учебнику", вроде..