Question

我正在使用next.js，并在 getInitialProps（）中调用我的API调用，并将它们映射到 props ，就可以了。但是当我的页面没有JavaScript时（例如chrome view-source：localhost ），则无法正确呈现。

这是我的 getInitialProps（）：

 静态异步getInitialProps（props）{
    const res =等待REQUEST_getCar（）;
    返回{
        //这是针对https://github.com/isaachinman/next-i18next
        namespacesRequired：['common']，
        ... res
    };
}

这是我的第一个

  render（）{
    const {t，start，end，search_id} = this.props;
    const {error} = this.state;
    const {media_set，year，mileage_range，owner，body_style，color，color_code，cancel_policy，transmission_type，location，facility_set，description，capacity，car} = this.props;
   返回（
       
            {说明} 
            {容量} 
       
   ）;

但是我进入 body 标签的全部是：

  
  
 

<脚本>
__NEXT_DATA__ = {
  道具： {
    initialI18nStore：{}，
    initialLanguage：null，
    i18nServerInstance：null，
    pageProps：{
      namespacesRequired：['common']，
      rentalCarID：“ 31”，
      开始：“ 1398/03/12”，
      结束：“ 1398/03/16”，
      search_id：'0d79a3db-8b0b-4a23-a10f-685fffdcdbcb'，
      年：{fa：'۲۰۱۹-۱۳۹۸'，en：'2019-1398'}，
      miles_range：{
        结束：100000，
        开始：50000，
        编号：2
        优先级：1
      }，
      avg_price_per_day：250000，
      body_style：{fa：“سواری”，en：“ Passenger Car”}，
      颜色：{fa：'قرمز'，en：'Red'}，
      color_code：'＃FF0000'，
      cancel_policy：空，
      描述：“一些测试描述”，
      容量：5
      汽车：{
        id：705，
        容量：5
      }，
      facility_set：[{id：24，名称：'Audio Input'}]，
      已加载：是的，
      media_set：[
        '/media/17/i/20190507/1557234331_15e443c2e330.jpg'，
        '/media/17/i/20190507/1557234331_658460b2eb99.jpg'
      ]
    }
  }，
  页面：“ / car”，
  查询：{
    id：“ 31”，
    开始：“ 1398/03/12”，
    结束：“ 1398/03/16”，
    search_id：'0d79a3db-8b0b-4a23-a10f-685fffdcdbcb'
  }，
  buildId：“开发”
};
__NEXT_LOADED_PAGES__ = [];
__NEXT_REGISTER_PAGE = function（r，f）{
  __NEXT_LOADED_PAGES __。push（[r，f]）;
};

这是为什么，以及如何调试next.js找出为什么 render 方法不起作用？可能是因为我的依赖吗？

Answer 1

您的内容应放在<div id="__next"></div>内，因此在这里不要管__NEXT_DATA__脚本。检查您的Layout组件，并确保没有加载或条件渲染。您可以将Layout替换为一个简单的段落来测试该应用。

为什么Next.js呈现“ <script> __ NEXT_DATA__ = ...”而不是页面的render（）方法？

1 个答案: