无法在 React js 中获取 `props` - 下一个 js 应用程序

Question

我正在使用 React Js 和 Next Js 作为我的框架开发 Server Side Rendering React 应用程序，我正在尝试使用 getServerSideProps 方法获取初始道具也参考文档 (next js doc for getServerSideProps)。

但每次请求时，我总是得到空的道具对象 {}。现在，我只是想在道具中传递一个虚拟文本。

如何在初始加载时获得我的 props？

请参考我下面的代码

import React from "react";
import { Provider } from "react-redux";
import ConfigureStore from "../Store";

const Home = props => {
  const store = ConfigureStore();
  console.log("props", props);
  return (
    <Provider store={store}>
      <div>My content</div>
    </Provider>
  );
};

// This gets called on every request
export async function getServerSideProps() {
  const data = "Hello World";
  return { props: data };
}

export default Home;

Answer 1

import React from "react";
import { Provider } from "react-redux";
import ConfigureStore from "../Store";

const Home =({ data }) => {
  console.log("data", data);
  return (
      <div>My content</div>
  );
};

// This gets called on every request
export async function getServerSideProps() {
  const data = "Hello World";
  return { props: {data :"Hello World"} };
}

export default Home;

Answer 2

getServerSideProps is that it can only be exported from a page. You can’t export it from non-page files. Same goes with getStaticProps 的问题。

所以你不能在部分组件中使用它。

这意味着您只能直接对 /page 目录中的文件使用它。

无法在 React js 中获取 `props` - 下一个 js 应用程序

Not to able to get `props` in react js - next js app

javascript

reactjs

next.js