在next和mobx中,如何获取'getServersideProps'的返回值?

时间:2020-09-23 00:43:19

标签: server-side-rendering mobx next

我一直在使用'react,next,mobx'。 我的ssr动态页面存在一些问题。

我对邮递员测试了SSR后,结果没有错误。 在实体代码的下面,邮递员给了我。

在div标签的''中,这是我要放入数据的部分

                    <main class="ant-layout-content site-layout-background"
                        style="padding:24px;margin:0;min-height:280px">
                        <div>
                            <!-- -->
                        </div>
                        <div>
                            <!-- -->
                        </div>
                        <div>
                            <!-- -->
                        </div><a href="/edit?id=3"><button>Edit</button></a><button>delete</button>
                    </main>
...

    <script src="/_next/static/chunks/react-refresh.js?ts=1600821412152"></script>
    <script id="__NEXT_DATA__" type="application/json">
        {"props":{"pageProps":{"data":{"id":3,"category":"2","title":"ssr test","content":"\u003cp\u003essr test\u003c/p\u003e\n","createdAt":"2020-09-22T13:58:26.000Z","updatedAt":"2020-09-22T13:58:26.000Z","deletedAt":null}},"__N_SSP":true},"page":"/posts/[id]","query":{"id":"3"},"buildId":"development","isFallback":false,"gssp":true}
    </script>

下面,我已经在组件中进行了编码。

const Post = () => {
  const router = useRouter();
  const { id } = router.query;

  const onClickDelete = useCallback(() => {
    editPost.postD(id);
  }, [])

  return useObserver(() => (
    <AppLayout>
      <div> {toJS(dynamicPost.post?.createdAt)} </div>
      <div> {toJS(dynamicPost.post?.title)} </div>
      <div> {ReactHtmlParser(toJS(dynamicPost.post?.content))} </div>

      <Link      href={{
        pathname: '/edit',
        query: { id:id },
      }}><a><button>Edit</button></a></Link>
      <button onClick={onClickDelete}>delete</button>

    </AppLayout>
  ));
};
export async function getServerSideProps(context) {

  const res = await fetch(`${backUrl}/errors/react/dpost?key=${context.query.id}`)
  const data = await res.json()

  return { props: { data } }
}

0 个答案:

没有答案