有没有办法在 Next.js 的 getStaticProps 中使用 redux 工具包？

Question

我在使用 useEffect 而不是 getStaticProps 时获取数据。但是在 getStaticProps 中显示 hooks 只能在功能组件中使用。

import Head from 'next/head'
import Image from 'next/image'
import Sidebar from '../components/Sidebar'
import styles from "../styles/Home.module.css"
import CssBaseline from '@mui/material/CssBaseline'
import Navbar from '../components/Navbar'
import Mainbody from '../components/Mainbodi'
import { useGetCryptosQuery } from '../services/CryptoApi'

export default function Homee({res}) {
   console.log(res);
   return (
      <div>
         <div className={styles.container}>
            <CssBaseline />
            <Sidebar/>
            <div className={styles.bodi}>
               <Navbar/>
               <Mainbody/>
            </div>
         </div>
       </div>
   )
}

export const getStaticProps = async() => {
   const {data, isFetching} = await useGetCryptosQuery()
   return {
      props: {
         res: data.data.coins
      }
   }
}

Answer 1

目前，只有在非 SSR 场景下才能使用 RTK Query with Next。这将随着 RTK 版本 1.7 而改变。

见https://github.com/reduxjs/redux-toolkit/pull/1277

您可以根据需要使用 Next 的其余 RTK。

Answer 2

随着 RTK 查询版本 1.7 的发布，可以支持 SSR。虽然，按照official docs, you need to setup next-redux-wrapper先。

有没有办法在 Next.js 的 getStaticProps 中使用 redux 工具包？

Is there any way to use redux toolkit inside getStaticProps in Next.js?

reactjs

server-side-rendering

next.js

redux-toolkit