import { FC } from "react"; import styles from "./article.module.css"; import { GetServerSideProps } from "next"; import { addApolloState, initializeApollo } from "../../commons/graphql/client"; import { ARTICLE } from "../../commons/graphql/queries"; import { Article } from "../../commons/graphql/generated"; import { formatRelative } from "date-fns"; import { zhCN } from "date-fns/locale"; import Head from "next/head"; interface Props { article: Article; } const ArticleDetails: FC = ({ article }) => { // const router = useRouter() // const { data } = useQuery<{ article: Article }>(ARTICLE, { // variables: router.query, // }); return (
{article.title} - Ivan‘s Blog - IvanLi.cc

{article.title}

作者 Ivan Li，发布于
); }; export const getServerSideProps: GetServerSideProps = async ({ params }) => { const apolloClient = initializeApollo(); const { data } = await apolloClient.query<{ article: Article }>({ query: ARTICLE, variables: params, }); return addApolloState(apolloClient, { props: { article: data.article }, }); }; export default ArticleDetails;