Как исправить ошибку при использовании Redux с Next.js 13?

  • 24 августа 2023 г. 13:26
Ответы на вопрос 2
Ошибка возникает потому, что в вашем коде вы не оборачиваете компонент в провайдер Redux. Правильным способом использования Redux с Next.js 13 является обертывание вашего компонента в провайдер Redux в файле _app.tsx.

Вам следует создать файл _app.tsx в корневой папке проекта (если его нет) и обернуть ваше приложение провайдером Redux. Вот пример кода:

_app.tsx:
```jsx
import { Provider } from 'react-redux'
import store from '../store/store'

function MyApp({ Component, pageProps }) {
  return (
    <Provider store={store}>
      <Component {...pageProps} />
    </Provider>
  )
}

export default MyApp
```

Затем вы можете удалить свой компонент AppProvider.tsx и все ссылки на него в вашем коде.

Теперь ваше Redux хранилище будет доступно для всех компонентов вашего приложения.

Надеюсь, это поможет вам исправить ошибку!
<AppProvider>
  <>
    <Header/>
    {children}
  </>
</AppProvider>

"use client"
import store from '../store/store';
import { Provider } from 'react-redux';
import { Children } from 'react';

export default function AppProvider({ children }:any) {
  return (
    <Provider store={store}>
      <>
        {Children.map(children, child => <>{child}</>)}
      </>
    </Provider>
  );
}
Похожие вопросы