【问题标题】:nextjs - Does not getInitialProps working? in dynamic routesnextjs - getInitialProps 不工作吗?在动态路线中
【发布时间】:2021-09-22 18:46:27
【问题描述】:

我有问题。使用 getInitialProps 函数,返回值没有到父组件。

但是,在 getInitialProps 函数中,我在 console.log 中看到了正确的值

实体代码下方

import * as React from "react";
import {dynamicPost} from "../../store/dynamicPost";
import AppLayout from "../../components/AppLayout";
import {toJS} from 'mobx';
import {useRouter} from 'next/router'

const Post = ({post}) => {
  console.log("in Post, props ", post);    //  <<<<<<<<<<<   undefined. why?????
  const router = useRouter();
  const {id} = router.query;
  return (
    <AppLayout>
      <div>{id} article</div>
    </AppLayout>
  );
};

Post.getInitialProps = async ({res, query}) => {
  console.log("in Post, getIP, res  ;", res);
  console.log("in Post, getIP, query  ;", query);  // { id : 3 }
  await dynamicPost.eReactPostR(query.id);
  let post = await toJS(dynamicPost.eRPrender)
  console.log('in getinitialProps data;' , post);   // here, the value was that I want it
  return post;
};
export default Post;

【问题讨论】:

    标签: javascript reactjs dynamic next.js


    【解决方案1】:

    getInitilProps 在 2 个不同的环境中运行:

    1. 服务器端,仅在第一页呈现
    2. 客户端,使用Link 组件从第一次渲染中导航时。

    您的实现使用dynamicPost,在不同的环境中评估时可能具有不同的值

    【讨论】:

    • 感谢您的解决方案,但是,我不明白为什么我不能在“props”的 Post 组件中获得价值。为了解决这个问题,在 getInitialProps 的返回值中将 props 更改为 {props}。但我无法解决这个问题。
    猜你喜欢
    • 1970-01-01
    • 2021-08-04
    • 1970-01-01
    • 2019-09-01
    • 2021-11-04
    • 2021-06-23
    • 1970-01-01
    • 2020-03-25
    • 1970-01-01
    相关资源
    最近更新 更多