小编Ibr*_*him的帖子

我正在制作Reddit克隆，并且正在使用Next.js，以便呈现其服务器端。我开始时没有使用Next.js，当我了解了它之后，我立即切换到了它。

我创建了一个自定义，_app.js以便页眉和侧边栏出现在每个页面上，并且它充当保存应用程序状态的最顶层组件。后来还不太行。

这里是.project/src/pages/_app.js：

import App, { Container } from 'next/app';

// Components
import Header from '../components/Header/Header';

const MainLayout = props => (
  <React.Fragment>
    <Header
      isSidebarOpen={props.isSidebarOpen}
      sidebarToggle={props.sidebarToggle}
    />
    {props.children}
  </React.Fragment>
);

export default class MyApp extends App {
  static async getInitialProps({ Component, router, ctx }) {
    let pageProps = {};

    if (Component.getInitialProps) {
      pageProps = await Component.getInitialProps(ctx);
    }

    return { pageProps };
  }

  state = {
    isSidebarOpen: true
  };

  sidebarToggle = () => {
    this.setState({ isSidebarOpen: !this.state.isSidebarOpen …

这是函数：

const getUserIP = async () => {
  let response = await fetch('https://jsonip.com/');
  let json = await response.json();

  console.log(json.ip)
  return json.ip;
};

在控制台中，IP 地址按预期记录。但是，当我将“IP 地址”保存到变量时：

const ip = getUserIP();

然后ip在控制台输入，值显示为：

Promise { <state>: "fulfilled", <value>: "/* my IP here*/" }

我在 YouTube 上观看过视频，这些视频使用了相同的逻辑/语法，尽管 API 不同，但它确实有效。我搜索了 Google 和 SO，但找不到有相同问题的线程。

我缺少什么？

谢谢。