我使用时获取数据useEffect
代替getStaticProps
。但在getStaticProps
它表明钩子只能在功能组件中使用。
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
}
}
}
随着RTK查询1.7版本的发布,提供了对SSR的支持。虽然,根据官方文档 https://redux-toolkit.js.org/rtk-query/usage/server-side-rendering#server-side-rendering-with-nextjs,你需要设置next-redux-包装器 https://github.com/kirill-konshin/next-redux-wrapper first.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)